Date Validation problems with JQuery .valid() method

Question

I'm trying to change the jquery date valuation to en-GB culture without success. For example for 23rd March 2013, I want to enter 23/03/2013 and not 03/23/2013.

When I call the validation method on the form it returns false. I'm not getting a validation error from Kendo, just from the jquery method.

How can I change the culture setting for jQuery?

<script src="@Url.Content("~/Scripts/Kendo/cultures/kendo.culture.en-GB.min.js")"></script>
<script>kendo.culture("en-GB");</script>
...
@(Html.Kendo().DatePickerFor(model => model.OrderDate).HtmlAttributes(new { style = "width:150px", required = "required"  }).Culture("en-GB").Format("dd/MM/yyyy"))
...
var isValid = $("#orderForm").valid();   // returns false if I select 23/3/2013

Thanks.

Answer 1

Put this in your script,and take the regex from here: Regex to validate date format dd/mm/yyyy

jQuery.validator.methods.date = function (value, element) {
            var dateRegex = /copyRegexHere/;
            return this.optional(element) || dateRegex.test(value);
        };

Answer 2

This is a known issue with WebKit browsers and jQuery validation. It appears to have been raised with the team some time ago but many users are still reporting issues.

There are a couple of ways to debug and work around this issue. Firstly try overriding jQuery validation to ensure that this is in fact the problem you're seeing:

jQuery.validator.methods["date"] = function (value, element) { return true; }

Alternatively, hack jquery.validate.js by finding the function:

date: function (value, element) 

And insert something like this, as taken from this post (please note that $.browser is now deprecated and the following is to illustrate a potential approach):

if ($.browser.webkit) {
    var d = new Date();
    return this.optional(element) || !/Invalid|NaN/.test(new Date(d.toLocaleDateString(value)));
}
else {
    return this.optional(element) || !/Invalid|NaN/.test(new Date(value));
}