Skip to content

Kirby 3.9.8

Checkboxes field

<k-checkboxes-field>

This UI component hasn't been finalized yet. The functionality and syntax aren't stable and might be redone in an upcoming release. Only use it at your own risk - breaking changes are likely to occur.

Have a look at <k-field>, <k-input> and <k-checkboxes-input> for additional information.

Props

Prop Type Default Description
after
string
autofocus
boolean
before
string
columns
number
counter
boolean
true
disabled
boolean
endpoints
object
help
string
icon
string|boolean
id
number|string
function() { return this._uid; }
input
string|number
invalid
boolean
label
string
max
number
min
number
name
number|string
novalidate
boolean
false
options
array
required
boolean
theme
string
translate
boolean
type
string
value
array|object
function() { return []; }
The value for the input should be provided as array. Each value in the array corresponds with the value in the options. If you provide a string, the string will be split by comma.

Events

Event Description Passes
blur
focus

Slots

Slot Description
after
before
counter
default
footer
header
help
icon
label
options

In addition, inherits the props from <k-field>, <k-input> and <k-checkboxes-input>.

Example

<k-checkboxes-field
    v-model="value"
    :options="[
        { value: 'a', text: 'Option A' },
        { value: 'b', text: 'Option B' }
    ]"
    :required="true"
    :min="2"
    :max="5"
    label="Checkboxes"
    help="This is a checkbox field"
    @input="input"
/>

CSS classes

.k-checkboxes-field