vdl-field
Represents an input field in a form. The input type is derived from the data type of the entity but can be overridden via the "type" attribute. Validation is performed on initialization and on value change and the input is highlighted with a red border when validation fails.
Required parent element
Must be contained within one of the following elements:
Example
<vdl-form>
<vdl-field entity="MY_BOOLEAN"></vdl-field>
</vdl-form>
Attributes
| checked-value | For checkboxes, the value to use to indicate it should be checked (default is true). | ||
|---|---|---|---|
| enabled | A boolean expression or a string ("true"/"false") which indicates whether the field is enabled. | accepts expression | |
| entity | Model entity to bind to. Either this or the "parameter" attribute must be specified. | ||
| indices | The index tuple to use if the entity bound to this field is an array. | accepts expression | |
| inline | Whether to use inline layout for the field. | ||
| label | Custom label for the input. If not specified then the entity alias or parameter name will be used. | accepts expression | |
| label-size | The number of column units for the label, a value from 1-12. | ||
| options | An expression that results in an array of values to use for the select options or a map object of values (in the form [{value: 'underlying_value', label: 'Display Text'}]) to display text. This will transform the input into a select box. | accepts expression | |
| options-include-empty | Allow a string entity to be cleared or an array element to be removed using the select input. Setting this to true will add a blank item to the top of the select list. Defaults to false. Can only be used on a string entity, an array entity or a parameter. Cannot be used on a radio input type. | ||
| options-set | Name of a set entity from the model to use for select options. This will transform the input into a select box. | ||
| parameter | Model parameter to bind to. Either this or the "entity" attribute must be specified. | ||
| post-save | An expression or a function, which is executed after a successful save.It can return a boolean or a promise, which can then resolved or rejected. If a promise is rejected, it will display an error with a rejection message. | accepts expression | |
| pre-save | A string, an expression or a function, which is used to determine whether to save or not new value. Can return a truthy value or a Promise, which can be resolved with a truthy value or can be rejected with an error message and error name | accepts expression | |
| pre-save-error-message | A string or an expression, which is used to display an error message, when pre-save fails. If pre-save returns a rejected promise, it will use rejection message instead | accepts expression | |
| scenario | Scenario id/index of this field | accepts expression | |
| size | The number of column units for the input element, a value from 1-12. | ||
| type | Specify an alternative HTML input type, such as radio, textarea, range, password. | ||
| unchecked-value | For checkboxes, the value to use to indicate it should be unchecked (default is false). |