2018-01-03 20:14:15 -02:00
|
|
|
---
|
2018-08-07 14:46:54 -06:00
|
|
|
label: 'Select'
|
2018-07-25 07:47:26 -04:00
|
|
|
target: select
|
2018-01-03 20:14:15 -02:00
|
|
|
---
|
|
|
|
|
|
|
|
The select widget allows you to pick a single string value from a dropdown menu.
|
|
|
|
|
|
|
|
- **Name:** `select`
|
|
|
|
- **UI:** HTML select input
|
|
|
|
- **Data type:** string
|
|
|
|
- **Options:**
|
|
|
|
- `default`: accepts a string; defaults to an empty string
|
|
|
|
- `options`: (**required**) a list of options for the dropdown menu; can be listed in two ways:
|
2018-08-07 14:46:54 -06:00
|
|
|
- string values: the label displayed in the dropdown is the value saved in the file
|
|
|
|
- object with `label` and `value` fields: the label displays in the dropdown; the value is saved in the file
|
2018-01-03 20:14:15 -02:00
|
|
|
- **Example** (options as strings):
|
2018-08-14 07:37:07 -07:00
|
|
|
```yaml
|
|
|
|
- label: 'Align Content'
|
|
|
|
name: 'align'
|
|
|
|
widget: 'select'
|
|
|
|
options: ['left', 'center', 'right']
|
|
|
|
```
|
2018-01-03 20:14:15 -02:00
|
|
|
- **Example** (options as objects):
|
2018-08-14 07:37:07 -07:00
|
|
|
```yaml
|
|
|
|
- label: 'City'
|
|
|
|
name: 'airport-code'
|
|
|
|
widget: 'select'
|
|
|
|
options:
|
|
|
|
- { label: 'Chicago', value: 'ORD' }
|
|
|
|
- { label: 'Paris', value: 'CDG' }
|
|
|
|
- { label: 'Tokyo', value: 'HND' }
|
|
|
|
```
|