JQuery Mobile Date picker does not show date in Chrome

Question

I have an MVC 4 site using jQuery Mobile. I am using a model with an editor to render a date editor. in MVC I have this:

@Html.EditorFor(Function(model) model.ActionDate)

A model property is defined as:

<Required>
<RegularExpression("\d{2}/\d{2}/\d{4}", ErrorMessage:="Please enter a date in the format of MM/DD/YY")>
<DataType(DataType.Date)>
<DisplayFormat(ApplyFormatInEditMode:=True, DataFormatString:="MM/dd/yyyy")>
<Display(Name:="Action Date")>
Public Property ActionDate As Date

It displays HTML with the value:

<input type="date" ... value="04/24/2013" />

But that shows the user the following:

The date is not displayed to the user, and 4/24/2013 is not the default value for choosing a date in Chrome. How to get chrome to actually show the date?

Thanks.

Answer 1

W3C, , <input type="date">, RFC3339. ISO8601.

, yyyy-MM-dd.

Answer 2

.

, type="date", datepicker:

$('#Date').removeAttr('type').attr('type', 'text').datepicker();

JQueryUI, datePicker.

( Chrome), :

$('#Date').removeAttr('type').attr('type', 'text').datepicker({ dateFormat: 'dd/mm/yy' });

Chrome jQueryUI - ( ).