Comment on page

select

This is a HTML select & option selection list field. You can only select one item.
Special properties of field
Property
Default
Accepted values
Description
values
none
Array or Function
List of items. It can be an array with items, or a Function, what is resulted an array. The item will be a String or an object with an id and a name properties.
selectOptions
{}
Object
Settings to select component. See details below.
selectOptions
Property
Default
Accepted values
Description
noneSelectedText
<Nothing selected>
String
Change the text for the no selection option.
hideNoneSelectedText
false
Boolean
Hide the noneSelected item
value
id
String
Used to select any properties from object in values to use as actual value to save in model.
name
name
String
Used to select any properties from object in name to use as display in the list
Usage
Select field with array of strings:
{
    type: "select",
    label: "Type",
    model: "type",
    values: [
        "Personal",
        "Business"
    ]
}
If you select the first item, the value will be "Personal" in the model.
Select field with object items:
{
    type: "select",
    label: "Language",
    model: "lang",
    required: true,
    values: function() {
      return [
        { id: "en-GB", name: "English (GB)" },
        { id: "en-US", name: "English (US)" },
        { id: "de", name: "German" },
        { id: "it", name: "Italic" },
        { id: "fr", name: "French" }
      ]
    },
    default: "en-US",
    validator: validators.required
}
If you select the second item, the value will be "en-US" in the model.
Creating an <optgroup> with Select field:
{
    type: "select",
    label: "Choose the fastest",
    model: "the-fastest",
    required: true,
    values: [
        { name: "Marc Marquez", id: "93", group: "MotoGP" },
        { name: "Valentino Rossi", id: "46", group: "MotoGP" },
        { name: "Lewis Hamilton", id: "44", group: "Formula 1" },
        { name: "Sebastian Vettel", id: "5", group: "Formula 1" }
    ],
    validator: validators.required
}

radios

submit

Last modified 4yr ago

Property	Default	Accepted values	Description
`noneSelectedText`	`<Nothing selected>`	`String`	Change the text for the no selection option.
`hideNoneSelectedText`	`false`	`Boolean`	Hide the noneSelected item
`value`	`id`	`String`	Used to select any properties from object in `values` to use as actual value to save in model.
`name`	`name`	`String`	Used to select any properties from object in `name` to use as display in the list

select

Special properties of field

`selectOptions`

Usage

Select field with array of strings:

Select field with object items:

Creating an `<optgroup>` with Select field: