Skip to content

SelectInput

The SelectInput component provides a convenient select field complete with label and validation support.

Examples

js
const colors = [
    { label: 'Red', value: 'red' },
    { label: 'Blue', value: 'blue' },
    { label: 'Green', value: 'green' },
]
html
<SelectInput label="Colors" name="colors" :items="colors"  />

An example can be seen in /frontend/views/ComponentExamples.vue

Component Props

PropDescriptionOptions
namethe field name of the select input
labelthe text label of the select input
itemsan array of objects representing the select options. Each object contains a label and valye prop.
classesadditional comma delimited list of css classes to apply to the input element

Component Events

EventDescriptionArgs
--

CSS Classes

ClassDescription
.input-errorthe class applied when there is a validation error