Multi Paged Form empowers one with capability of incorporating multiple forms in one single form in a simple and elegant way.
In the example shown below, the form contains a Multi Paged Form that is configured with 4 pages with tabbed style.
Figure 1: Sample Multi Paged Form
The first 2 pages point to "Personal Form" and "Education Form" whereas the next 2 pages also point back to the same set of forms but serve as a confirmation screen. Configurations are shown below.
Figure 2: Sample Multi Paged Form Properties
In Page 3 and 4, they must be referenced back to the same key used in Page 1 and 2 in order to show the form data intended.
In Page 3 and 4 as well, the pages are set to be read only.
The option Partially store form when page changed? in the general settings must also be checked as well.
Figure 3: Multi Paged Form - Properties
ID |
Element ID |
Label |
Element Label |
Number of Page |
Number of pages should be allocated. |
Partially store form when page changed? |
Form data of the current page will be stored on page change if checked. |
Figure 4: Multi Paged Form - Properties - Page
Label |
Label of the page. Displays in the form of breadcrumb or tab depending on the setting in UI. |
Form |
Form to be assigned to the page. |
Readonly? |
Determines if this page is editable. |
Parent Form Field to keep Child Form ID |
ID of the field in the parent form to store the page's primary key. Page data will be loaded based on the record ID retrieved from this field. |
Child Form Field to keep Parent Form ID |
ID of the field in the page form to store the parent form's primary key. |
Validate when change page |
Perform validation check on page change. User must pass validation set in the current page if checked. |
Figure 5: Multi Paged Form - Properties - UI
Display Mode |
Determines the style of the Multi Paged Form whether to display in Wizard or in Tabs. |
Previous Button Label |
Label of the navigation button. |
Next Button Label |
Label of the navigation button. |
Only enable submit button on last page? |
If checked, one must fill up all the pages' form before one can submit the form/ complete the task. |
CSS |
Custom CSS implementation. |