The field ‘BirthDate’ must be a date MVC 4, internet explorer 11

asp.net-mvc-4internet-explorer-11

The same question were asked in this thread The field 'Date' must be a date MVC 4 but I have slightly different problem.I got the error while using internet explorer 11, not able to figure it out.
Here is the property in my model

[Required]
[Display( Name = "Birth Date")]
[DataType(DataType.DateTime)]
public DateTime BirthDate { get; set; }

and jQuery is


$(function () {
dateFormat: $.datepicker.RFC_1123;
$('#BirthDate').attr('readonly', true);
$('#BirthDate').datepicker({ dateFormat: "d/M/yy" });
});

and code for textbox

@Html.TextBoxFor(model => model.RFI.BirthDate, "{0:dd/MMM/yyyy}", new { datepicker = true, @class = "textbox_medium", id = "BirthDate" })

to support this format I wrote the following code in jquery.validate.js file, in the function definition of "date: function (value, element)"

if ($.browser.webkit) {

//ES – Chrome does not use the locale when new Date objects instantiated:
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));

}

The mentioned code works correctly in Crome but doesn't works in internet explorer 11. Frstly it gives the error for webkit, then I changed the definition of a date function (replace code with previous definition) still it gives an error of "The Birthday must be date "

Best Answer

I did a full test of your scenario. The error occurs in IE in jquery.validate.js on the following check:

    // http://docs.jquery.com/Plugins/Validation/Methods/date
    date: function( value, element ) {
        return this.optional(element) || !/Invalid|NaN/.test(new Date(value).toString());
    },

For quick prove you can try to write the following in Console in both IE and Chrome:

new Date('01/Jun/2001');

In Chrome you'll get a valid date and in IE invalid.

To fix the issue - change the format in your date picket to a default one "dd/mm/yy":

$('#BirthDate').datepicker({ dateFormat: "dd/mm/yy" });
Related Topic