Edit this page

Restrict User Input to Min/Max Values

The following example demonstrates how to restrict user input to minimum or maximum values that are set through the widget configuration.

Example:

    <input id="DOB" value="30/06/2010" />
    <script>
      $(function() {
        $("#DOB").kendoDatePicker({
          format: "dd/MM/yyyy",
          min: new Date(2000, 10, 10),
          max: new Date(2020, 10, 10),
          change: onDOBChange
        });
      });
    </script>

    <script>
        function onDOBChange(e) {
            var dt = e.sender;
            var value = dt.value();

            if (value === null) {
              value = kendo.parseDate(dt.element.val(), dt.options.parseFormats);
            }

            if (value < dt.min()) {
                dt.value(dt.min());
            }else if (value > dt.max()) {
                dt.value(dt.max());
            }
        }
    </script>

See Also

For more runnable examples on the Kendo UI DatePicker, browse its How To documentation folder.

Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article

close
Dummy