[Solved] Numeric Text Box - Step smaller than decimal producing error

[Mike]

This may be a valid error but I'd like to get some understanding of it.  

<kendo-numerictextbox for="AttendancePercentage" min="0.0001" max="1" decimals="4" step="0.1" format="{0:p2}" class="form-control w-75" />

I have the above NTB added to a form. If I manually type the value of 0.95, I then receive the error of "Please enter a multiple of 0.1."  Once I increased the step to 0.001, it works without issue. 

Why would it validate that value that way?

[Vasko]

Hello Mike,

The NumericTextBox uses the step property to determine which values are valid for entry. The step acts as an increment - only values that are exact multiples of the step (within the defined min and max) are considered valid.

With step="0.1", only values that can be reached by starting at the minimum (or default base) and adding multiples of 0.1 are valid: 0.1, 0.2, 0.3, ..., 0.9, 1.0, etc. The value 0.95 is not a multiple of 0.1 (since 0.95 / 0.1 = 9.5, not a whole number). The browser's native validation kicks in and displays the "Please enter a multiple of 0.1." message.

By setting step="0.001", more values (like 0.95, 0.951, 0.123, etc.) become valid because they are multiples of 0.001. This allows the NumericTextBox to accept and validate values with higher precision.

I hope this information helps you out.

Regards,
Vasko
Progress Telerik

[Mike]

Is it not possible for these to be independent of each other?  I would like for the user to be able to step by tenths but still be able to put in based on the number of decimals.  This would make it so use of the helper arrows takes care of common values but still leaves open the ability for the user to enter in what is needed.

[Vasko]

Hello Mike,

The step property in the NumericTextBox is used for both spinner increments and input validation. This means the allowed values must be multiples of the step, and this behavior is enforced by the browser's native validation. As a result, it is not possible to have independent control over spinner increments and manual input validation out-of-the-box.

Setting step="0.1" allows spinner arrows to increment by tenths, but manual input is restricted to multiples of 0.1. Setting a smaller step (e.g., step="0.001") allows manual entry of more precise values, but spinner arrows will increment by the smaller step, which may not be ideal for your scenario.

Possible Workaround:

• You can use a smaller step value (such as step="0.001") to allow manual entry of values with more decimals.
• To make spinner arrows increment by tenths, you would need to implement custom logic. For example, you can handle the spin event and programmatically increase or decrease the value by 0.1 when the arrows are used.

You can try the below configuring of the NumericTextBox for more precise values:

<kendo-numerictextbox name="numerictextbox"
    min="0.0001"
    max="1"
    decimals="4"
    step="0.001"
    format="{0:p2}">
</kendo-numerictextbox>

Regards,
Vasko
Progress Telerik