Validate Multi-Step Form Submissions

Verify step-by-step validation, navigation, value retention, and final submission using required fields placed on different steps.

Multi-step forms validate the current step before allowing visitors to move forward. The final form submission also runs the normal form validation flow. Test required fields on more than one step so you can confirm that visitors can correct errors on the right page instead of submitting an incomplete form.

Prepare a validation test form

  • Create at least two steps using Step Break fields.
  • Add a required field to the first step and another required field to a later step.
  • Save the form and open the frontend preview or published page. For the field and button settings, see Build a Multi-Step Form.

Test step navigation

  • Next with a missing required value: leave a required field empty and select Next. The form should stay on the current step and display its validation error.
  • Next with valid values: complete the required fields and select Next. Confirm the next step becomes active.
  • Previous: move back and check that previously entered values remain in their fields.
  • Step indicator: when using Numbers & Labels or Dots Only, test navigation through the current or already completed steps. The indicator does not allow jumping directly ahead over uncompleted steps.

Test final submission and errors

  • Complete the form through the final step and submit it. Confirm that the submission succeeds and the expected entry is saved.
  • Test a validation failure associated with a later step. When the submission flow reports an error on a different step, the frontend step handler attempts to navigate to the step containing the first displayed error and focus that field.
  • After a successful submission, verify the form resets to the first step if it remains on the page.

If the form does not advance

  • Check whether the current step contains a required field or another field validation error.
  • Confirm the required value is valid, not merely non-empty; email, URL, numeric, date, time, and mask fields may have additional checks.
  • Test the actual frontend form because the Step Break field is represented by a placeholder in the editor preview.

Screenshot to add: Frontend multi-step form showing a required-field error that prevents moving to the next step

Back to Conditional and Multi-Step Forms