Setting up footer buttons

Footer buttons are optional buttons located in the footer of dependent forms.

To set up a footer button

1. Open the dependent form.

2. Click .

3. Enter the button label in the Label field.

4. Select the button type from the Type dropdown.

   Each type has a different style:

   • Primary

   • Secondary

   • Danger

   • Ghost

   • Promo

   • Translucent

5. Select the button On click action.

   This is the action that is executed when the user clicks the footer button.

   • No action

     The button does nothing.
   • Callback

     Executes a callback.

     1. Select the callback from the dropdown.

     2. Specify the mapping for the callback request and/or response payloads.

   • Open form

     Opens a form from the form group.

     1. Select the form from the dropdown.

     2. [Optional] Map form model data items between the source and target forms.

   • Close form

     Closes the form.

Example

In this example, an Open form footer button is added to the User details dependent form. User details has four form model data items:

• userid

  An input parameter, which is mapped to the userid form model data item of the root form when a user clicks to view a specific user’s details.

  This is used to map to the request payload of the User details data initializer callback, which returns the other three form model data items.
• userfirstname

  An input element, which is mapped to the data initializer callback response payload.
• usersecondname

  An input element, which is mapped to the data initializer callback response payload.
• useremail

  An input element, which is mapped to the data initializer callback response payload.

The Open form footer button opens the User contact details dependent form. User contact details requires userid to map to the data initializer callback request payload, so the developer must create an input parameter on User contact details and performs the request mapping. The developer then maps the source form (user details) userid form model data item to this new target form (User contact details) userid input parameter. The developer also maps the three input element data items on the source form to corresponding input element data items in the target form. The rest of the user contact data is mapped from the data initializer callback response payload to the UI elements.