Building Forms

Building Forms

The Form Builder

The drag-and-drop form builder lets you add, arrange, and configure fields visually. You can create multi-page forms, group related fields together, and control the layout width of each field.

Creating a Form

Go to Forms > New Form. Give it a name, an optional description, and save. You are taken to the builder where you can add fields and configure settings.

Field Types

There are 19 field types organised into four groups:

Input Fields:

• Short Text — A single-line text input.
• Long Text — A multi-line text area for longer responses.
• Email — An email input with built-in email format validation.
• Phone — A phone number input.
• Number — A numeric input that validates for numbers only.
• Date — A date picker.
• Time — A time picker.
• URL — A web address input with URL format validation.

Selection Fields:

• Dropdown — A single-select dropdown menu. Define the options in the field settings.
• Multi-Select — A dropdown that allows choosing multiple options.
• Radio Group — A single choice from a set of radio buttons displayed inline.
• Checkbox Group — Multiple choices from a set of checkboxes.
• Checkbox — A single true/false toggle (e.g., “I agree to the terms”).

Special Fields:

• File Upload — Let respondents upload files. Configure accepted file types, maximum file size, and maximum number of files. Dangerous file types (PHP, HTML, SVG, JavaScript, executables) are automatically blocked for security.
• Calculated — A read-only field that computes a value from other fields using a formula. Configure the formula, decimal precision, and display format (number, currency, or percentage).

Layout Fields:

• Heading — A section heading to visually organise the form.
• Paragraph — A block of descriptive text or instructions.
• Divider — A horizontal line separator.
• Field Group — A container that groups related fields together. Nest other fields inside a group for visual organisation.

Field Properties

Every field has the following configurable properties:

• Label (required) — The name displayed to the respondent.
• Description (optional) — Help text shown below the field.
• Placeholder (optional) — Ghost text shown inside the input when empty.
• Required — Whether the field must be filled out to submit the form.
• Hidden — Whether the field is initially hidden. Use with conditional logic to show it based on other field values.
• Default Value (optional) — A pre-filled value. Supports tokens like {{user.name}}, {{user.email}}, {{today}}, and references to other fields.
• Width — Layout width: Full (100%), Half (50%), or Third (33%). Use half or third widths to place multiple fields side by side on the same row.
• Page — Which page this field appears on (for multi-page forms).

Validation Rules

In addition to the Required toggle, you can add custom validation rules:

• Minimum length/value — The minimum number of characters (for text) or minimum numeric value (for numbers).
• Maximum length/value — The maximum number of characters or numeric value.
• Pattern — A custom regex pattern the value must match (for advanced validation).
• Allowed values — A list of specific values that are accepted.
• Custom error messages — Override the default validation messages with your own text for each rule.

Options for Selection Fields

For Dropdown, Multi-Select, Radio, and Checkbox Group fields, you define the available options. Each option has a label (what the respondent sees) and a value (what is stored in the submission data). You can also configure dynamic options that are loaded automatically from your contacts or custom entity records.

Reordering and Multi-Page

Drag and drop fields to reorder them. To create a multi-page form, assign fields to different page numbers. Respondents will see a “Next” and “Previous” button to navigate between pages.