Controlled Mode

Updated on Jun 24, 2026

By default, the Kendo UI for Vue OTPInput operates in uncontrolled mode and manages its own internal value state.

Controlling the Value

To place the OTPInput in controlled mode you have two options:

1. Use v-model and assign the value to it.

or:

1. Set its value property.
2. Handle the onChange event and update the value in your component state.

The following example demonstrates controlled mode, including programmatic value setting and clearing via buttons.

Change Theme

Theme

Loading ...

Suggested Links

• API Reference of the OTPInput Props