Skip to content

Kirby 3.5.7.1

Time Input

<k-time-input>

<k-input v-model="time" name="time" type="time" />

Props

autofocus

Boolean (default: false)

If true, the input will be instantly focused when the form is created

disabled

Boolean (default: false)

If true, the input is disabled and cannot be filled in or edited

icon

String (default: null)

Sets the icon, that is shown on the right next to the input.

id

String (default: null)

The id for the input element.

name

String (default: null)

The name of the input element.

notation

Number (default: 24)

Switches between the 12 or 24 hours format. In case of 12 hours, an additional AM/PM selector will be shown.

required

Boolean (default: false)

If true, the input must not be empty

step

Number (default: 5)

The step between each option in the minutes selector.

theme

String (default: null)

By default, inputs are as unstyled as possible to provide a clean boilerplate. If you need the typical field input look, you can set the theme to field

value / v-model

String (default: null)

The time must be provided as iso date string. i.e. 2012-12-12T22:33:00 or just the time 22:33:00

Methods

focus()

The focus event can be used to set the focus on the input.

Events

@input

The input event is triggered when the value changes.

@invalid

The invalid event is triggered when the input validation fails. This can be used to react on errors immediately.

CSS class

.k-time-input