Configuring Conditional Navigation Buttons
Click on Images to Expand Them
In a Docupace Start wizard a button with an Action Type "Perform Transition Action" is used to navigate to a specific wizard page based on conditions, such as data entered into wizard fields or any other conditions. This allows to skip pages, that are not necessary for the end-user. For example, if a page collects data about additional account stakeholders, but the user has previously marked that he is the sole entity owner, then it is not useful to show him the additional stakeholders page. He needs to proceed directly to the next steps of the wizard.
If the page contains several Action buttons that use different transitions, you must define a separate transition with a different name for each button in the Page Settings. In the simple example below, the wizard will navigate to one of three pages based on the radio button selected by the user. Proceed as follows:
To configure a button for conditional navigation, you will need to:
place on the wizard's page the data field(s) that will be used as conditions
create and configure the "Perform Transition Action" button
define the transition action itself and its condition rules in the Page Settings.
Step 1: Create a New Wizard
Adding three pages to a wizard
Step 2: Add a Field to pageOne
Field Settings for a Single Selection field
Field | Value | Details |
---|---|---|
Field Label |
| This is the name of the field that is visible to the user and is displayed above the field. |
Meta Field Name |
| This is the unique name for the data held within the field. It will be used to define the conditions for the transition action. |
Display Type | Radio list | This will show the choices as radio buttons. |
Layout | Vertical | The radio buttons will be placed vertically, as a bulleted list. |
Choices | Add the following choices by clicking +Add button:
|
|
Required | Selected | The user will be required to fill in this field. This is a built-in validation. An asterisk will be displayed next to the field label. |
Size by content | Selected | The field will take up only as much space as its text. The Column Span and Horizontal Alignment settings in this case will be ignored. |
Step 3: Add an Action.
Adding an Action field
Field Settings for an Action field
Field | Value | Details |
---|---|---|
Field Label |
| This is the name that is displayed on top of the Action button. |
Navigate only if the form is valid | Selected | When the user clicks this button, Docupace Start will check whether Single Selection field is filled out. If no radio button is selected, an error message will appear, and the user will need to correct the issue before navigating away from this page. |
Action Type | Perform Transition Action |
|
Action Value |
| This is the name of the Action as it will be defined in Page Settings. |
Size by content | Selected | The button will take up only as much space as its text. It will be located right next to the Single Selection field. The Column Span and Horizontal Alignment settings in this case will be ignored. |
Step 4: Configure pageOne Transition Settings
Setting | Description | Details |
---|---|---|
Transitions | Transition rules define, which page will be opened next. Conditions will be checked one by one in the order as they appear. The first condition which is evaluated to TRUE, defines the page that will open next. If neither of the conditions defined below evaluates to TRUE, then no action will be performed, i.e., the user will remain on the same page of the wizard. | If the page contains several Action buttons that use different transitions, you must define a separate transition with a different name for each button. In this case, we only need one transition with two rules. |
Transition name |
| The name used to refer to this specific transition from the Action button. |
Transition rules (1st rule) | Value | Details |
---|---|---|
Page ID |
| Name of the page that will open, if the condition below evaluates to TRUE. In this case, if the user selects the "Second page" radio button. |
Condition |
|
|
Transition rules (2nd rule) | Value | Detail |
---|---|---|
Page ID |
| Name of the page that will open, if the condition below evaluates to TRUE. In this case, if the user selects the "Third page" radio button. |
Condition |
|
|
Defining Transitions in Page Settings
Note: Click +Add at the bottom of this section to create another condition.
Step 5: Save Your Changes
Step 6: Test Your Wizard
Testing the Conditional Navigation Button