New to Kendo UI for jQuery? Download free 30-day trial

Validate If Value Is in the Correct Format


Product Progress® Kendo UI® DatePicker for jQuery Progress® Kendo UI® DateTimePicker for jQuery
Product Version Tested up to version 2017.3.1026



How can I validate whether the input of the user in the DatePicker is in the correct format?


Use the Kendo UI Validator and create a custom validation rule which validates the format of the date.

    <h2>Use client-side validation:</h2>
    <form id="form">
      <input data-role="datepicker"
             data-bind="value: selectedDate"
             style="width: 20%">
      <span class="k-invalid-msg" data-for="date"></span>


      $(function () {

        var viewModel = kendo.observable({
          selectedDate: new Date(),

        kendo.bind($("#form"), viewModel);

          rules: {
            // Implement your custom date validation.
            dateValidation: function (input, params) {

              if ("[name='date']") && input.val() != "") {
                input.attr("data-datevalidation-msg", "Not a valid date in MM/dd/yyyy format!");

                var date = kendo.parseDate(input.val(), "MM/dd/yyyy");
                if (date) {
                  return true;
                return false;
              return true;                    
          messages: { //custom rules messages
            datevalidation: function (input) {
              // Return the message text.
              return input.attr("data-val-datevalidation");

See Also

In this article