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

Validate Custom Dates

The following example demonstrates how to create a custom date validation in the DateTimePicker.

  <div id="example">
    <div id="to-do">
      <input id="datetimepicker" name="datetimepicker" style="width:200px;" required />
      <span class="k-invalid-msg" data-for="datetimepicker"></span>

      $(document).ready(function () {
        // Create DateTimePicker from the input HTML element.
          value:new Date(),
          parseFormats: ["MM/dd/yyyy"]

        var validator = $("#example").kendoValidator({
          rules: {
            datepicker: function(input) {
              if ("[data-role=datetimepicker]")) {
              } else {
                return true;
          messages: {
            datepicker: "Please enter valid date!"
    <style scoped>
      #to-do {
        height: 52px;
        width: 221px;
        margin: 30px auto;
        padding: 91px 0 0 188px;
        background: url('../content/web/datepicker/todo.png') transparent no-repeat 0 0;

See Also

In this article
Not finding the help you need? Improve this article