Edit this page

Display Additional Error Notification

Environment

Product Version 2017.1 117
Product Progress Kendo UI NumericTextBox

Description

How can I provide additional notification that the NumericTextBox value must be a number to the user?

Solution

  1. In the document ready event handler, append the desired span by using the k-numeric-wrap class selector.
  2. Display the span when the NumericTextBox has the k-state-invalid class by using CSS.

    <style>
        span.myInvalid {
            position: relative;
            top: 30px;
            left: -130px;
            color: red;
            visibility: hidden;
        }
    
        .k-state-invalid>span.myInvalid {
            visibility: visible;
        }
    </style>
    <input id="textbox">
    
    <script>
        $("#textbox").kendoNumericTextBox({
            value: 10
        });
    
        $(document).ready(function() {
            $(".k-numeric-wrap").append("<span class='myInvalid'>Enter a number!</span>");
    
        });
    </script>
    
Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article

close
Dummy