Breadcrumbs

Wizard Forms

A wizard form shows one page at a time, with Next and Previous buttons, instead of one long page. Use wizards for long forms, applications and step-by-step processes.

Make a form a wizard

  1. Open the form in the form builder.

  2. In the form settings at the top, set Display as to Wizard.

  3. Add a Panel for each page of the wizard, and put that page's components inside it. The panel's title is used as the page title.

  4. Save the form.

A step indicator at the top shows the page titles and where the user is. Users move between pages with Next and Previous, and submit on the last page with Submit Form. Each page is checked before users can move on.

The first page of a wizard, with a step indicator for Applicant, Position and Review above the fields, and Cancel and Next buttons
The first page of a three-page wizard

Run JavaScript before a wizard is submitted

Wizard forms have a Before Submit JavaScript box in the form settings. Your script runs in the user's browser when they submit, after the form passes validation and before the submission is saved. Use it to set a value or choose where users go after submitting.

The form settings with Display as set to Wizard, and the Before Submit JavaScript box containing one line of script
Display as Wizard, and the Before Submit JavaScript box

Your script can use:

Variable

Contains

data

The form's current values, by field key, for example data.department

form

The form. Set form.returnUrl to send users to a page after submitting.

submission

The submission about to be saved

Example: choose the page users go to after submitting

JavaScript
if (data.applicationType === 'contractor') {
  form.returnUrl = 'https://www.example.com/contractor-next-steps';
} else {
  form.returnUrl = 'https://www.example.com/employee-next-steps';
}

Example: fill in a value before saving

JavaScript
data.submittedOn = new Date().toISOString();

The submittedOn field must exist on the form, for example as a Hidden component.

If the script causes an error, the submission is not saved and the user sees Before Submit JavaScript failed. Please contact the form administrator. Test scripts carefully, and check the browser console (F12) for the error details.

Before Submit JavaScript requires GlobalForms version 10.21 or greater.