Overview
Once you have created a dynamic form, you build it by dragging fields onto a canvas and arranging them into the layout you need. This article covers adding, resizing, and reordering form fields.
Form Builder Layout
The form builder page has three areas:
Left Panel — Form Fields — a column titled "Form Fields" with the description "Drag a field onto the canvas." Fields are grouped into two sections:
Data Fields: Check Box, Date, Dropdown, File, Number, Radio Buttons, Repeater, Select Document, Select Process, Select User, Text, Text Area
Layout: Divider, Section Header, Section Text
Centre — Canvas — titled with your form name. This is where you build your form by dropping fields.
Right Panel — DCM (Dynamic Content Manager) — titled "Form Details" with tabs for Form Details, Field Properties, and Business Rules.
Adding Fields to the Canvas
Quick Steps
From the left panel, drag a field type onto the canvas
A shadow indicates where the field will be placed
Release to drop the field in position
Once dropped, the field appears as a chip on the canvas with:
A drag-and-drop icon at the top (for reordering)
The field type as the chip title
A description of the field type
A delete icon on the right
The chip fills the full width of the canvas by default
Resizing Fields on the Canvas
Hover over the right-hand edge of a field chip
The cursor changes to a horizontal resize cursor with the tooltip "Resize width"
Click and drag to adjust the width
During resizing, the chip title turns green. If the chip is too narrow for its text, the text wraps onto the next line.
Resizing Fields via Properties
You can also set an exact width using the Properties tab in the DCM:
Select the field on the canvas
In the DCM, open the Properties tab
Set the Width Percentage (default is 100%, valid range is 3–100%)
Select Save
Reordering Fields
Hover over the drag-and-drop icon at the top of a field chip
The cursor changes to a move/four-way arrow with the tooltip "Drag to move"
Click and drag the field to its new position
A shadow indicates where the field will be placed
Fields with reduced width can be positioned side by side, provided their combined width does not exceed the canvas width.
Important: Always preview your form after rearranging fields to confirm the layout appears as expected. See Previewing and Testing a Dynamic Form.
Deleting Fields
Select the field on the canvas
Click the delete icon on the right side of the chip
Further Information
For configuring individual field settings (labels, required, hidden, options), see Configuring Form Field Properties. For adding repeatable sections, see Working with Repeater Fields.