Textarea Field Element
A multi-line plain-text editing form control.
The Textarea Element displays a <textarea> HTML element, use it to allow users entering a sizeable amount of free-form text, for example, a comment on a review or feedback form.
Settings
It inherits common settings with the following specifics:
| Setting | Description | Dynamic |
|---|---|---|
| Placeholder | The text to be shown while there is no user input. | ✓ |
| Size | The field size applyied with uk-form-{size} modifier. | |
| Width | The field width applyied with uk-form-width-{width} modifier. | |
| Rows | The number of visible text lines by setting a value for rows attribute. |
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. |
Validation
It inherits common validation with the following specifics:
| Validation | Description | Dynamic | Browser Side | Server Side |
|---|---|---|---|---|
| Min Length | The minimum content length that the input value must constrain to, greater than or equal to. | ✓ | ✓ | ✓ |
| Max Length | The maximum content length that the input value must constrain to, lower than or equal to. | ✓ | ✓ | ✓ |
| Pattern | The regular expression pattern that the input value must match 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 Textarea Element from the Form Essentials group.
- Access the element settings and input a Control Name.