Prevent Arrow Keys from Changing NumericTextBox Value

Updated on Mar 31, 2026

Environment

Product Version	14.2.1
Product	Progress® KendoReact NumericTextBox

Description

I want to prevent the ArrowUp and ArrowDown keys from increasing or decreasing the value in the NumericTextBox. Using stopPropagation in onKeyDownCapture blocks the event from reaching a parent onKeyDown handler (for example, on a wrapping <td>), which is not desirable.

Solution

Intercept the value update inside the onChange handler. Check whether the change was triggered by an arrow key or mouse wheel event and, if so, skip the state update. This approach blocks the value change without calling stopPropagation, so the parent onKeyDown handler still fires normally.

Change Theme

Theme

Loading ...

See Also

• KendoReact NumericTextBox
• API Reference of the NumericTextBox