Add a Page Navigation control from which the Request participant can go to another page in a multi-page Screen.
The Page Navigation control adds a button from which the Request participant can go to another page in a multi-page Screen. See a design example.
This control is only available for Form-type Screens. See Screen Types.
Watch the following product tour to learn how to use a Page Navigation control.
For a documented example of using this control, see Page Navigation Control to Design a Multi-Page Screen.
Follow these steps to add this control to the Screen:
Configure the Page Navigation control. See Settings.
Validate that the control is configured correctly. See Validate Your Screen.
Below is a Page Navigation control using the "Secondary" Variant option.
For a documented example of using this control, see Page Navigation Control to Design a Multi-Page Screen.
The Page Navigation control has the following configurable settings in the Properties Panel:
Expand the Variable panel from the Properties Panel on the right to configure the following properties:
Expand the Configuration panel from the Properties Panel on the right to configure the following properties:
Expand the Design panel from the Properties Panel on the right to configure the following properties:
Expand the Advanced panel from the Properties Panel on the right to configure the following properties:
From the Controls Menu on the left, expand the Navigation category, and then locate the Page Navigation icon.
Drag and drop the control to the Screen Builder canvas. Existing controls in the Screen will adjust positioning based on where you drag the control.
Enter the text label that displays for this control. Page Navigation is the default value.
Select the destination page to which to navigate in a multi-page Screen. Current pages in the multi-page Screen display. If the Screen contains only one page, the Destination Screen setting displays No Data Available when selected.
Link: White-colored background with blue-colored Button Label text.
Specify an expression that indicates the condition(s) under which this control displays. See Expression Syntax Components. If this setting does not have an expression, then this control displays by default.
Both: The control displays on both desktop and mobile devices. Both toggle keys are enabled by default.
Enter the value to represent this control in custom CSS syntax when in Custom CSS mode. As a best practice, use the same CSS Selector Name value on different controls of the same type to apply the same custom CSS style to all those controls.
The Aria Label setting value replaces the Label setting value. For example, if a control has both a Label setting value and an Aria Label setting value, assistive technology only uses the Aria Label setting value.
Enter the number for the sequential keyboard navigation order that this control takes focus amongst other controls in this Screen.