Splitting a form into pages

When to split a form into pages

A long form on a single page can feel like a wall of questions, especially on a phone. Splitting it into pages makes it much easier to deal with — and gives users immediate feedback as they go.

Reach for page breaks when:

• The form has more than roughly 15 fields and feels long to scroll
• There are clear logical sections — for example "Pre-start checks", "During work", "Post-work sign-off"
• Your team will be filling it in on a phone and shorter pages will help
• You want users to spot mistakes early rather than at the very end

Don't bother with page breaks for short forms — having to click Next when there are only five fields can feel like extra clicks for the sake of it.

Adding a page break

Page breaks are a structural field type. To add one:

1. 1

   Open the Form Builder.

2. 2

   Drag a Page break from the palette into the position where you want the form to split.

3. 3

   Optionally label it in the right-hand settings — the label is only visible in the builder, so you can keep track of which page is which while you're editing.

Each page break starts a new page. If you add three page breaks, you'll have four pages.

What the user sees

When someone opens a multi-page form, here's what they get:

• Page 1 loads first, showing all the fields up to the first page break
• A Next button at the bottom of every page except the last
• A Previous button on every page except the first
• A Submit button in place of Next on the final page
• A page indicator like "Page 2 of 4" so they can see how far through they are

Moving between pages feels just like a wizard — one logical step at a time.

Each page is checked before the user moves on

This is the key behaviour: when the user clicks Next, the form checks the current page on its own before letting them move on.

• If the page is fine, they move forward
• If anything's missing or filled in wrongly, the errors appear inline next to the offending fields, and they stay on the page until they fix them

That means a user can't accidentally fill in page 1, skip to page 4 and submit a half-finished form. Each page has to pass its own checks before they can carry on.

A final check on submit

When the user clicks Submit on the last page, the form runs through the whole thing end to end one more time. This catches anything that didn't show up during the per-page checks:

• Show/hide conditions that affect fields on earlier pages
• Calculated fields whose inputs sit on different pages
• Anything that wasn't relevant until the final page got filled in

If something's wrong, the form stays open with the errors shown so the user can navigate back to the page with the problem.

Hidden fields and pages

Fields hidden by conditional logic are skipped during the checks, including when they're on a different page. So if a field on page 3 is hidden because of an answer on page 1, the form won't flag it as missing.

It works in both directions — if a hidden field becomes visible later because the user changed something on a later page, the form starts checking it again from then on.

Going backwards

Click Previous at any point to step back to an earlier page. Going backwards never triggers any checks — you're not committing to anything by stepping back, so there's nothing to flag.

Saving as a draft mid-fill

If a multi-page form is long enough that the user can't finish it in one sitting, they can save what they've got as a draft and come back later. The draft preserves all the values across every page, so when they reopen it they pick up exactly where they left off. See Filling in and submitting a form for the draft mechanism.

Real-world example: handover form

A typical project handover form might have:

• Page 1 — Project details — the project name (Project picker), the client (Client picker), the date, the contract value
• Page 2 — Work completed — a checklist of completed scopes, plus a long text for any items still outstanding
• Page 3 — Snags — a Repeating section listing any snags identified at handover, with photos
• Page 4 — Sign-off — Signature fields for the contractor and the client, plus an Acknowledgement of completion

Each page is short enough to fill in quickly, and the user gets feedback at each step instead of staring at a single endless page.

Next steps

• Organising forms with sections and pages — for the Page break field type alongside the others.
• Showing fields only when needed — for how show/hide conditions interact with the per-page checks.
• Filling in and submitting a form — for the user's experience of multi-page forms.