Define Decimals Property at Runtime in NumericTextBox
Environment
Product | Progress® Kendo UI® NumericTextBox for jQuery | Product Version | 2019.1.115 |
Description
How can I change the decimals
property of the Kendo UI NumericTextBox at runtime from two decimal places to three?
Solution
-
Set the format of the NumericTextBox initially to
n2
. - When an event has occurred, such as a button click, get a reference to the NumericTextBox.
- Get the value of the NumericTextBox.
- By using the
setOptions
method, configure thevalue
,format
, anddecimals
properties.
<input id="numericTextBox1" />
<button class="k-button">Change Decimal</button>
<script>
$("#numericTextBox1").kendoNumericTextBox({
decimals: 2,
format: "n2",
value: 11.1234,
step: 0.01,
});
$("button").click(function() {
var numTextBox = $('#numericTextBox1').data('kendoNumericTextBox');
var numValue = numTextBox.value();
numTextBox.setOptions({ value: numValue, format: "n3", decimals: 3, step: 0.001});
});
</script>