La fecha del campo debe ser una fecha en mvc en chrome

Estoy haciendo una simple aplicación de Internet MVC4, que permite agregar algunos elementos a las categorías.

Esto es lo que hice hasta ahora.

Tengo un marcador de fecha en la vista de mvc. El script para datepicker es así.

  @Scripts.Render("~/bundles/jqueryval")  $(function () { $('#dtItemDueDate').datepicker({ dateFormat: 'dd/mm/yy', minDate: 0 }); });  

La propiedad de mi modelo:

  [DisplayName("Item DueDate")] [Required] [DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}",ApplyFormatInEditMode = true)] [DataType(DataType.DateTime)] public DateTime? dtItemDueDate { get; set; } public char charCompleted { get; set; } 

y en mi opinión, he hecho esto:

 @Html.TextBoxFor(m => m.dtItemDueDate) @Html.ValidationMessageFor(m => m.dtItemDueDate) 

El error es así:

 The field Item DueDate must be a date. 

Lo extraño es que funciona en IE y en mozilla, pero no funciona en Chrome.

Encontré muchas publicaciones en SO, pero ninguna de ellas ayuda

¿Alguna idea / sugerencia?

Nota del editor: esta respuesta ya no es válida, a partir de jQuery 1.9 (2013) se $.browser método $.browser


De acuerdo con este post , es un capricho conocido con navegadores basados ​​en Webkit.

Una solución es modificar jquery.validate.js encontrando la función date: function (value, element) y poner este código en él:

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

Sin cambiar jquery.validate.js, puede usar el fragmento de código siguiente en $(document).ready() :

 jQuery.validator.methods.date = function (value, element) { var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor); if (isChrome) { 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)); } }; 

La solución Rowan Freeman no funcionará para mí, ya que .toLocaleDateString(value) no analiza las cadenas de value

aquí está la solución que se me ocurrió => en jquery.validate.js encontrar esta definición de función: “fecha: función (valor, elemento)” y reemplazar el código con:

 // http://docs.jquery.com/Plugins/Validation/Methods/date date: function (value, element) { var d = value.split("/"); return this.optional(element) || !/Invalid|NaN/.test(new Date((/chrom(e|ium)/.test(navigator.userAgent.toLowerCase())) ? d[1] + "/" + d[0] + "/" + d[2] : value)); }, 

A continuación se muestra el código de trabajo que puede ser útil para que alguien solucione el problema del selector de fecha en Chrome y Safari: Modelo:

 public DateTime? StartDate { get; set; } 

Ver:

 @Html.TextBoxFor(model => model.StartDate, "{0:dd/MM/yyyy}", new { @type = "text", @class = "fromDate" }) 

js:

 $(function () { checkSupportForInputTypeDate(); $('#StartDate').datepicker({ changeMonth: true, changeYear: true, dateFormat: 'dd/mm/yy' }); }); //Function to configure date format as the native date type from chrome and safari browsers is clashed with jQuery ui date picker. function checkSupportForInputTypeDate() { jQuery.validator.methods.date = function (value, element) { var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor); var isSafari = /Safari/.test(navigator.userAgent) && /Apple Computer/.test(navigator.vendor); if (isSafari || isChrome) { 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)); } }; }