How to invoke an external web service in a wizard layout between step1 and step2?

Scenario: Trying to share selected options in Step1 of wizard layout to external system via integration with external web api, to retrieve complete details for step 2 screen. How to make a call within wizard in between steps.?

  Discussion posts and replies are publicly visible

  • 0
    Certified Lead Developer

    You can call the external web service in the saveInto of the SAIL component which helps you to go to the step2.

    Below is the example code, in which the web service call is made in the button widget if the step is 2.

    load(
      local!employee:{ firstName:null, lastName:null, department:null, title:null, phoneNumber:null, startDate:null },
      local!currentStep: 1,
      a!formLayout(
        label: "SAIL Example: Onboarding Wizard",
        contents:{
          a!columnsLayout(
            columns:{
              a!columnLayout(
                contents:{
                  a!textField(
                    label: "First Name",
                    labelPosition: if( local!currentStep = 3, "ADJACENT","ABOVE"),
                    value: local!employee.firstName,
                    saveInto: local!employee.firstName,
                    readOnly: local!currentStep = 3,
                    required: not( local!currentStep = 3),
                    showWhen: or( local!currentStep = {1,3} )
                  ),
                  a!textField(
                    label: "Last Name",
                    labelPosition: if( local!currentStep = 3, "ADJACENT","ABOVE"),
                    value: local!employee.lastName,
                    saveInto: local!employee.lastName,
                    readOnly: local!currentStep = 3,
                    required: not( local!currentStep = 3),
                    showWhen: or( local!currentStep = {1,3} )
                  ),
                  a!textField(
                    label: "Phone Number",
                    labelPosition: if( local!currentStep = 3, "ADJACENT","ABOVE"),
                    value: local!employee.phoneNumber,
                    saveInto: local!employee.phoneNumber,
                    readOnly: local!currentStep = 3,
                    required: not( local!currentStep = 3),
                    showWhen: or( local!currentStep = {2,3} )
                  )
                }
              ),
              a!columnLayout(
                contents:{
                 a!textField(
                  label: "Department",
                  labelPosition: if( local!currentStep = 3, "ADJACENT","ABOVE"),
                  value: local!employee.department,
                  saveInto: local!employee.department,
                  readOnly: local!currentStep = 3,
                  required: not( local!currentStep = 3),
                  showWhen: or( local!currentStep = {1,3} )
                ),
                a!textField(
                  label: "Title",
                  labelPosition: if( local!currentStep = 3, "ADJACENT","ABOVE"),
                  value: local!employee.title,
                  saveInto: local!employee.title,
                  readOnly: local!currentStep = 3,
                  required: not( local!currentStep = 3),
                  showWhen: or( local!currentStep = {1,3} )
                ),
                a!dateField(
                  label: "Start Date",
                  labelPosition: if( local!currentStep = 3, "ADJACENT","ABOVE"),
                  value: local!employee.startDate,
                  saveInto: local!employee.startDate,
                  readOnly: local!currentStep = 3,
                  required: not( local!currentStep = 3),
                  showWhen: or( local!currentStep = {2,3} )
                ) 
                }
              )
            }
          )
        },
        buttons: a!buttonLayout(
          primaryButtons: {
            a!buttonWidget(
              label: "Go Back",
              value: local!currentStep - 1,
              saveInto: local!currentStep,
              showWhen: or( local!currentStep = {2,3} )
            ),
            a!buttonWidget(
              label: if( local!currentStep = 1, "Next", "Go to Review"),
              value: local!currentStep + 1,
              saveInto: {
                  local!currentStep,
                  /* Call Web Service */
                  a!save(local!webServiceResult, if( local!currentStep = 1, null, webservicequery()))
                },
              validate: true,
              showWhen: or( local!currentStep = {1,2} )
            ),
            a!buttonWidgetSubmit(
              label: "Onboard Employee",
              style: "PRIMARY",
              showWhen: local!currentStep = 3
            )
          }
        )
      )
    )

  • 0
    Certified Lead Developer
    HI as per my understanding This Integration Object invokes an API of type GET call (as you want to retrieve complete details). You can invoke this Integration Object in following ways:

    1. Upon load()
    2. using saveInto

    If you want to query the information using Integration Object while clicking on a button, then you need to make a call to API using this Integration Object under Button saveInto. Now it all depends upon your business scenario, whether you want to make this call conditionally or unconditionally.