NumericTextBox Overview

The NumericTextBox enables the user to edit and submit specific numeric values by typing or by using the spin buttons.

It converts an <input> element into a numeric, percentage, or currency textbox. The conversion data type depends on the specific format. The component renders spin buttons which increase or decrease its value with a predefined step. The NumericTextBox accepts only numeric entries and uses the kendo.culture.current culture to determine the number precision and other culture-specific properties. When the NumericTextBox initializes, it wraps the <input> element with a <span></span> tag and renders Spin buttons.

The NumericTextBox wrapper for Vue is a client-side wrapper for Kendo UI NumericTextBox widget.

The NumericTextBox-no- Component is part of Kendo UI for Vue, a professional grade UI library with 90+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.

Basic Usage

The following example demonstrates the NumericTextBox in action.

View Source
Change Theme:

Functionality and Features


The following example demonstrates basic NumericTextBox events. You can subscribe to all NumericTextBox events by the handler name.

<div id="vueapp" class="vue-app">
    <kendo-numerictextbox v-on:change="onChange"></kendo-numerictextbox>

new Vue({
    el: "#vueapp",
	methods: {
		onChange (e) {
			var value = e.sender.value();