Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Canvas now enables you to post array of objects to a web service in a feasible and viable manner. By means of simple and efficient configurations, you can post the array of objects to a web service, thereby facilitating the means of posting the data to a web service in an effective way. To post the array of objects to a web service, perform the following steps in Canvas Studio:

Let's assume that a web service connection has already been created in Canvas Studio. For detailed information on creating a web service connection, refer Creating a Web Service Connection.

  1. In the Connections list, right-click the existing web service connection and select the Create Data Source option.



    The Create New Data Source screen appears.



  2. Enter a unique name in the Data Source Name field, e.g. POST WEB SERVICE DS.
    1. Enter the appropriate relative part of the web service URL in the Relative part of the URL field, e.g. publisher/AutoFunding.
    2. Click the Communication App ID drop-down list and select the REST POST JSON Gateway option.



  3. Click the Upload JSON option to upload the appropriate JSON file, e.g. Details.json.

    Code Block
    languagebash
    { 
    "Response": {
     "chargeCurrencyCode": "USD",
     "CommissionAmount": "1", 
     "TotalCreditAmount": "10", 
     "StatusDescription": "SUCCESS",
     "serviceTaxAmount": "0",
     "StatusCode": "0",
     "TotalDebitAmount": "10"
     }
    }


    Image Modified

  4. Specify the appropriate column root in the Column Root field, e.g. $.Response.




  5. In the JSON Configuration, categorized under Request JSON Configuration, click theicon, on the extreme right side of the Object tab to create a new object.



  6. Type the appropriate array name in the Name field, e.g. record.

    Note

    For an array, the suffix $form should be added to the array Name, e.g. record$form.




  7. Click the Text drop-down list and select the Array option.
    1. Proceed to click Add.



  8. Hover the mouse on the extreme right side of the newly created array and clickicon to add a new object.



  9. Click the Text drop-down list and select the Object option.



  10. To add the object, click Add.



  11. Hover the mouse on the extreme right side of the newly created object and clickicon to add a new object.



  12. Provide the appropriate key in the Name field, e.g. accountNumber.
    1. Enter an appropriate value in the Value field, e.g. $form.accountNumber.
    Note

    The value should be mandatorily provided as $form.<Value> in the Value field, e.g. $form.accountNumber.




  13. To add the object, click Add.



  14. To save the web service data source, click Save.



    A confirmation message, indicating the successful creation of web service data source, appears.



  15. Click Ok.
  16. After successfully creating the web service data source, proceed to create a request for the web service using Request Modeler in Canvas Studio. For detailed information on creating a request, refer Configuring Request Modeler and Creating Library Request.
  17. On successfully creating the request, a form gets created automatically and the form can be viewed in the Form Definition List, with the provided Request ID serving as the Form ID
  18. To pass the array of values in the form's listener file, specify the array of values, as shown in the following code snippet: 

    Note

    The key "accountNumber" should be similar to the key, provided during the creation of web service data source. The suffix _T1 should be added to the Request Model ID in the form model, associated with the Request Modeler forms. The following code snippet serves as a sample reference: 

    Code Block
    languagejs
    fm.model.setValue("<REQ_MODEL_ID>_T1",arr); //To set the array of objects in the form model



    Code Block
    languagejs
    canvas.form.listeners.ReqForm = Class(canvas.Observable, {
      constructor: function(config) {
        this.fm = config.fm;
      },
      registerHandlers: function() {
        this.fm.registerHandler(CFEC.CLICK, 'BUTTON_FIELD7',  function(fm, event, fieldName, value) {	
    			var arrObj = [{
    							"accountNumber": "000100000100003"
    						},
    						{
    							"accountNumber": "0001000001006767"
    						},
    						{
    							"accountNumber": "000100000105757"
    						},
    						{
    							"accountNumber": "0001000001005425"
    						},
    						{
    							"accountNumber": "00010000010245245"
    						},
    						{
    							"accountNumber": "0001000001045252"
    						},
    						{
    							"accountNumber": "000100000100567572"
    						},
    						{
    							"accountNumber": "000100000153454302"
    						}];
    			fm.model.setValue("TESTCBX_T1",arrObj); //TESTCBX is the Request Model ID
    			canvas.modeler.executeAction(fm,"SUBMIT");
            });
    }
    });
    
    CFLR.registerListener("TEST_REQ_FORM", canvas.form.listeners.ReqForm);