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.

Basic Usage

The following example demonstrates the NumericTextBox in action.

Example
View Source
Edit In Stackblitz  
Change Theme:

Functionality and Features

Events

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>
</div>
Vue.use(InputsInstaller);

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