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.

score 1 · Accepted Answer · edited May 23 '17 at 12:20

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);
        };

edited May 23 '17 at 12:20

Community

1
1

answered Mar 25 '14 at 00:30

gMailMan

161
1
8

I'm getting an "Uncaught TypeError exception" for the Regex. I've tried the first two regex in above link. – user797717 Mar 25 '14 at 11:21
You must put / at the end and at the begining of it in javascript. Like this `/regex/` – gMailMan Mar 25 '14 at 16:41
I've tried the following but I'm still getting a type error exception: var dateRegex = '/(^(((0[1-9]|[12][0-8])[\/](0[1-9]|1[012]))|((29|30|31)[\/](0[13578]|1[02]))|((29|30)[\/](0[4,6,9]|11)))[\/](19|[2-9][0-9])\d\d$)|(^29[\/]02[\/](19|[2-9][0-9])(00|04|08|12|16|20|24|28|32|36|40|44|48|52|56|60|64|68|72|76|80|84|88|92|96)$)/'; – user797717 Mar 25 '14 at 23:51
You dont need the apostrophe,remove it. – gMailMan Mar 26 '14 at 00:07

score 0 · Answer 2 · edited May 23 '17 at 12:05

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));
}

Thanks. But I'm having the issue in all common browsers not only WebKit browsers. — user797717, Mar 26 '14 at 12:57

Date Validation problems with JQuery .valid() method

2 Answers2