Select Field Element
A multi-option one-line form control.
The Select Element displays a <select> HTML element, use it to allow users to choose, by selection, a single or multiple pre-established options.
Settings
It inherits common settings with the following specifics:
Setting | Description |
---|---|
Size | The field size applied with uk-form-{size} modifier. |
Width | The field width applied with uk-form-width-{width} modifier. |
Height | The number of rows in the list that will be visible by default, if Multiple Selection is enabled. |
Multiple Selection | Should it be allowed to choose more than one option. |
Common Settings
Setting | Description | Dynamic |
---|---|---|
Label | The title for the field that represents the field data. | ✓ |
Control | The name that identifies the field control within the form. It's required and must be unique for the Form Area. | |
Value | The efault value for the field. The user can change it. | ✓ |
Readonly | Should the field be read-only. Any default value will be unedible. | |
Autofocus | Should the field will be autofocused as soon as the page loads. Only one field can be focused on each page. | |
Sync ID / Control | Should the field ID attribute obtain it value from the Control Name. |
Options
Options are specified as child items that can be input manually as well as dynamically with the use of a Dynamic Content source. Each option has the following settings:
Setting | Description |
---|---|
Value | The option value, must be unique among its siblings. |
Text | The option text, defaults to the value if omitted. HTML tags will be stripped. |
State | Defines if the option is Disabled or Enabled . Disabled options are unusable and unclickable. |
Validation
It inherits common validation with the following specifics:
Validation | Description | Dynamic | Browser Side | Server Side |
---|---|---|---|---|
Min | The minimum amount of options that must be chosen, greater than or equal to . | ✓ | ✓ | |
Max | The maximum amount of options that can be chosen, lower than or equal to . | ✓ | ✓ |
Common Validation
Validation | Description | Dynamic | Browser Side | Server Side |
---|---|---|---|---|
Required | Defines if the field must have a value. | ✓ | ✓ | ✓ |
Error Message | A message that will be displayed if the element validation fails. Optionally use {fieldlabel} as placeholder, it will be replaced with the field label. | ✓ | ✓ |
Integration
- Access a Builder layout and create a Form Area.
- Add a Select Element from the Form Essentials group.
- Access the element settings and input a Control Name.