Columns
The Columns element arranges the elements inside it side by side, so several fields can share one row of the form.
The Columns element is a layout container that arranges its child elements side by side in a multi-column grid. It is the primary tool for building dense, form-efficient layouts where you want multiple inputs to share the same horizontal row โ such as First Name / Last Name, Start Date / End Date, or any pair of related fields.
Each Column within the Columns container has its own label and visibility controls, giving you fine-grained layout control. The parent Columns element also provides a hidelabels option to suppress individual field labels for an even more compact presentation. Both the parent and each individual column's visibility can be toggled at runtime via the data model.
Key Use Cases
โขย ย ย ย ย ย ย Side-by-side first/last name, city/country, or start/end date fields
โขย ย ย ย ย ย ย Compact review layouts showing a label column and a value column
โขย ย ย ย ย ย ย Conditionally hiding one column to collapse a two-column layout to one
โขย ย ย ย ย ย ย Creating responsive-feeling form layouts without custom CSS
Runtime API โ Attributes in Procesio Forms
Both the Columns container and each individual Column have their own API attributes, all accessible at runtime via the data model.
Columns Container:
| API Name | Description | Type | Default | Notes |
|---|---|---|---|---|
| hidelabels | If true, suppresses labels inside all child columns | boolean | true | โ |
| visible | Show or hide the entire columns container | boolean | true | โ |
| name | Unique element name | string | โ | โ |
| id | Unique element ID | string | โ | โ |
Individual Column:
| API Name | Description | Type | Default | Notes |
|---|---|---|---|---|
| label | Display label for this column | string | โ | โ |
| tooltip | Help text shown alongside this column's label | string | โ | โ |
| visible | Show or hide this specific column | boolean | true | โ |
| name | Unique column name | string | โ | โ |
| id | Unique column ID | string | โ | โ |
For support, please join our Discord community for further assistance and support.
List
The List element is a powerful repeating container that allows users to add, edit, and remove multiple structured items within a single form. Eachโฆ
Stepper
The Stepper element breaks a long or complex form into a sequence of named steps, presenting one step at a time with Previous and Next navigationโฆ