Date Picker Validation Not Working - 2014 release

3 posts, 0 answers
  1. Jonathan Ruckert
    Jonathan Ruckert avatar
    11 posts
    Member since:
    May 2005

    Posted 25 Mar 2014 Link to this post


    I am trying to get the Validator working on a KendoUI date picker and cannot see what I am doing wrong.

    I am attempting to use the following code.

    <div id="tickets">
      <label for="datepicker">Start Date</label>
      <input type="date" id="datepicker" name="searchstart" />
      <span class="k-invalid-msg" data-for="searchstart" validationMessage="Test"></span>
       $(document).ready(function() {
              format: "dd/MM/yyyy"
          var validator = $("#tickets").kendoValidator().data("kendoValidator");

    When the page loads, I can type what ever text I want in the date such as "kendo", lose focus on the element and no validation occurs.

    I have tested this on both JSBin and Kendo Dojo without any success

    What am I missing?

    Kind Regards,
  2. Jonathan Ruckert
    Jonathan Ruckert avatar
    11 posts
    Member since:
    May 2005

    Posted 25 Mar 2014 in reply to Jonathan Ruckert Link to this post

    So I have got something a bit working, however the events are not firing correctly.

    I have put together a JSBin explaining the issue that I'm now facing.

    If you remove the 4 from the first date picker, then tab to the next field, no validation occurs. If you then re-tab back into the field the validation fires successfully.

    Can anyone please shed some light on this please?
  3. Alexander Popov
    Alexander Popov avatar
    1436 posts

    Posted 27 Mar 2014 Link to this post

    Hello Jonathan,

    I already answered to this query in the support thread you opened, but I will copy my response here as well:

    This happens because at the time the validation rule is executed, the DatePicker's value is not yet changed. Initially, the value was a valid date, so this is why validation works the second time it is activated. You can manually parse the user input and see if it is a valid date, as seen in this updated example.

    Alexander Popov
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top