Adding logic to single-step forms enhances user experience by creating a dynamic flow where certain questions appear or disappear based on user responses.
Whether your form has no page breaks or includes them, this guide will walk you through setting up conditional logic effectively, while ensuring a smooth user flow.
What are single-step forms
In single-step or classic forms, all questions are visible on a single page by default.
Even if you add multiple pages using the "+New Page" field, the form will still follow the basic behavior of a single-step form.
You can add logic to show or hide fields based on user responses.
Step-by-step guide for adding logic to single-step forms
Step 1: Create your form
First, build your form with the fields you need.
For example, let's assume you have the following form fields:
Name
Single choice question
Email
CSAT (Customer Satisfaction score)
City
These fields will be used to create the conditions that show or hide certain fields based on user inputs.
Step 2: Add conditional logic to show or hide fields
You can set up rules that control when fields appear based on answers.
For example, in a form with 5 fields:
If the user selects Option 1 in the single-choice question, the form should display the Email field.
If the user selects Option 2, the CSAT field will be shown.
To achieve this:
Click on the first question and navigate to the Logic tab on the right-side menu..
Click on the Advanced Logic button.
Add a conditional rule like this:
Condition: If the answer is Option 1.
Action: Show the Email field.
Add another conditional rule:
Condition: If the answer is Option 2.
Action: Show the CSAT field.
This ensures that your form will dynamically adjust based on the user's selection.
Step 3: Use page breaks wisely
If you want to divide your single-step form into multiple sections, you can use page breaks.
However, when setting up logic with page breaks, ensure that the conditions rely only on the information collected on the same page. Otherwise, it could result in blank pages or confusing form transitions.
How to add logic to single-step forms with page breaks
In single-step forms with page breaks, it’s crucial to create logical conditions that use only the fields available on the current page.
Logic-based on questions from a different page might lead to errors such as blank pages or disrupted flow.
Step-by-step guide for logic with page breaks
Step 1: Organize your pages
Ensure that the questions on each page are self-contained. For instance, if you use a Single-choice question on Page 1 and want to show or hide other questions based on the answer, those conditions should apply only to fields on Page 1.
Step 2: Apply logic based on current page fields
If you use page breaks in your form, ensure that the conditions you set are based only on the fields before the page break. Here’s why:
Example: Let’s say you want to show a field on Page 2 based on an answer on Page 1. This could result in a blank page because the logic cannot reference fields across different pages.
To avoid this:
After adding a page break, ensure all logical rules apply to fields before the break.
If you want to control questions on Page 2, the logic should be based on the answers from Page 2, not the previous page.
Visualizing logic in single-step forms with the Logic Map
When adding conditional logic to single-step forms, a logic map provides a visual breakdown of each rule and how questions appear based on user responses.
This is especially useful for single-page forms or forms with page breaks, where keeping the flow intuitive is key.
Benefits of using the Logic Map for single-step forms
Clarify Show/Hide rules: With a map, see exactly where each show/hide condition leads, confirming that only relevant questions display based on user input.
Prevent blank pages: When using page breaks, the logic map ensures conditions are based on fields within the same page, helping avoid errors that result in blank pages.
Optimize form flow: A visual map allows you to refine how questions appear sequentially, creating a more streamlined experience without unnecessary steps.
Accessing and using the Logic Map
Open the Logic tab: In the form editor, go to the Logic tab, where you can set up show/hide rules.
Select the Logic Map overview option: The logic map shows a layout of each field and displays which ones appear based on conditions, especially useful for forms with multiple sections.
Review page transitions: When using page breaks, confirm that logic references only fields within the current page, ensuring a smooth flow from start to finish.
Using a logic map for single-step forms enables you to build efficient, responsive forms that adapt seamlessly to each user’s inputs, whether on a single page or across multiple sections.