Select
A dropdown menu for choosing a single option from a list.
The Select field renders a dropdown menu that lets users pick one option from a predefined list. It is the best choice when you have more than five options (where radio buttons would take up too much space) or when screen real estate is limited.
For the shared properties available on all fields (label, help, note, key, width, visual styling, required), see the Form Fields Overview.
Configuration
| Property | Type | Default | Description |
|---|---|---|---|
| placeholder | string | "Select an option" | Ghost text shown when no option is selected |
| options | Option[] | Two default options | List of selectable options, each with a value and label |
| allowSearch | boolean | -- | When true, adds a search/filter input inside the dropdown |
| defaultValue | string | -- | The value of the option that should be pre-selected |
Option structure
Each option in the options array has the following shape:
| Property | Type | Description |
|---|---|---|
| value | string | The programmatic value stored in submission data |
| label | string | The text displayed to the user |
| title | string | Optional bold heading for the option |
| description | string | Optional subtitle beneath the option |
Validation
The Select field extends InputFieldBase, so the required toggle is available. When required, the user must pick an option before the form can be submitted.
Example Usage
A department selection dropdown:
{
"type": "select",
"label": "Department",
"required": true,
"placeholder": "Choose a department",
"options": [
{ "value": "engineering", "label": "Engineering" },
{ "value": "design", "label": "Design" },
{ "value": "marketing", "label": "Marketing" },
{ "value": "sales", "label": "Sales" }
]
}