The navigation button field provides a single button that can be used to navigate to another page on your form. In most situations the Wizard Buttons will be easier to use as they provide intelligent back, next and submit buttons.
By default a navigation button behaves like the "Next" button in a wizard button. When clicked the fields on the page are validated, actions are performed, and the next page in the forms designer is displayed to the user.
Navigation through your form pages can be controlled by supplying a navigation function, allowing you to write logic that will display different pages depending upon the values entered in the form.
Repeating Pages
If your form includes repeating pages the default behaviour of the button is to navigate between page instances.
For example, consider a three page form with a navigation button on each page, and three instances (ie three repeats) of page two. Once a user has navigated to page three, a navigation button in back mode would navigate through instance three, then two, then one of the repeating page, then back to page one.
A navigation button can also create page instances if an exact number of instances is specified in your form design. Rather than a user adding instances themselves, if your repeating page settings' minimum and maximum instances are the same and validated, pressing "Next" will add a new page instance and navigate to it until the required number of instances is reached, at which point it will navigate to the next page. If there are zero required instances of a repeating page, it will be skipped.
Examples
Two tutorials guide you through form navigation: Multipage Forms and Navigation and Multipage Forms and Branching.
Form Back Buttons has examples of the behaviour of the back button.
The Page Modes article has some example functions, including a description of the three page modes and how to invoke them in your navigation functions.
Properties
| Label | Description | Type Name |
|---|---|---|
| Button Label | The label that will appear on the button | LABEL |
| Button type | Either "Normal" or "Contrast". Selecting contrast adds the class | BUTTONTYPE |
| Is iCM Panel Button | If set to true and the form is being displayed as a Form App shortcut within iCM, this button will be rendered as an action in the Actions Panel. The button itself will be hidden on the form. This allows better integration into iCM when needed | ISICMPANELBUTTON |
| Show | By default the button will always be displayed. Use "If not first page" and "If not last page" to hide the button from the first or last page of a form | SHOW |
| Show Function | This function is executed server-side as the page loads. If it returns true the button will be shown. The result of the function overrides the standard "Show" setting | SHOWFUNCTION |
| Navigation Mode | This sets the default behaviour of the button if you don't supply a navigation function. The various modes are: Back, no validation - The default setting allows a user to navigate back to the previous page as if this page hadn't been visited. Values that have been entered on the page won't be saved in the form session and no action fields will be triggered Back, no validation (link) - This behaves in the same way as no validation, but outputs the button as a link. Back links are generally placed at the top of a page and are not triggered by pressing the Enter key Back, validate, actions/no actions - In this mode the back button will only navigate away from the current page if there are no validation failures. Any values entered for the fields on the page will be saved in this form session. When performing validation it is also possible to control if action fields are triggered or not. In most circumstances performing actions when navigating back doesn't make sense Next, validate - Moving to the next page always validates the field inputs and stores their values in the form session. You can control whether or not actions on the page are triggered | NAVMODE |
| Navigation Function | This function determines which page should be displayed when the button is clicked. The default page will change depending on the navigation mode that's been chosen. Your function should return the name of the page to display instead. For example, this function could be added to page 3 of a form (navigating backwards), where page 2 may have been skipped: | NAVFUNCTION |
| Additional Styling Modifier | An optional CSS modifier for the field. See Common Field Properties for an example | ADDITIONALSTYLINGMODIFIER |
| Documentation | Add documentation to your field to help explain any complex functionality to future users. You might include information on what the field does and how it relates to other fields on the form. Notes added here are only ever visible in the Forms Designer, they can be searched for, viewed and downloaded from the action panel. See Common Field Properties for an example | DOCUMENTATION |
Share this page
