Validación no intrusiva para Datepicker en línea no funciona, funciona bien para Datepicker no en línea

Question

No utilicé el datepicker de jquery.ui porque necesitaba seleccionar una semana entera y varias fechas bajo diferentes condiciones, entonces estoy usando Keith Wood's datepicker en una EditorTemplate para mis campos de fecha:

@model Nullable<DateTime> 
    @{ 
     string name = ViewData.TemplateInfo.HtmlFieldPrefix; 
     string id = name.Replace(".", "_"); 
     string dt = Model.HasValue ? String.Format("{0:d}",(string)Model.Value.ToShortDateString()) : string.Empty; 
    }   
    @Html.TextBox("", dt, new { @class = "datefield", @type = "date", @id = id }) 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('#@id').datepick({ 
       renderer: $.datepick.themeRollerRenderer, 
       multiSelect: 999 
      }); 
     });  
    </script> 

Validación funciona bien cuando se utiliza un cuadro de texto y tener el selector de fechas "pop-up"; pero lo que realmente quiero es utilizar un selector de fechas en línea, pero no puede obtener la validación de trabajar en estas condiciones:

@model Nullable<DateTime> 
    @{ 
     string name = ViewData.TemplateInfo.HtmlFieldPrefix; 
     string id = name.Replace(".", "_"); 
     string dt = Model.HasValue ? String.Format("{0:d}",(string)Model.Value.ToShortDateString()) : string.Empty; 
    } 

    <div class="kwdp"> 
    </div> 
    @Html.Hidden("", dt, new { @class = "datefield", @id = id }) 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('.kwdp').datepick({ 
       renderer: $.datepick.themeRollerRenderer, 
       multiSelect: 999 
      }); 
     });  
    </script> 

Aquí está un recorte-it de mi encargo la validación del lado del cliente:

form.validate({ 
     rules:{ 
      StartDate: { 
       required: true, 
       dpDate: true 
      } 
     }, 
     messages: { 
      StartDate: 'Please enter a valid date (dd-mm-yyyy)' 
     } 
    }); 

Y aquí es la definición del campo DateTime en mi clase de datos:

[Required] 
    [DataType(DataType.Date)] 
    [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:dd-MM-yyyy}")] 
    public Nullable<DateTime> StartDate { get; set; } 

entiendo que debo añadir una onSelect para el selector de fecha para poblar el campo oculto con fecha (s), pero sin tener en cuenta , Debería obtener un error cuando el valor del campo oculto está vacío, pero no es válido. El marcado HTML es interpretado como el siguiente:

<input name="StartDate" class="datefield" id="StartDate" type="hidden" data-val-required="The StartDate field is required." data-val="true" data-val-date="The field StartDate must be a date." value=""/> 

estoy usando las siguientes bibliotecas:

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>  
    <script src="@Url.Content("~/Scripts/datepick/jquery.datepick.min.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/Scripts/datepick/jquery.datepick.ext.min.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/Scripts/datepick/jquery.datepick.validation.min.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/Scripts/jquery.ui.datepicker.validation.min.js")" type="text/javascript"></script> 

He encontrado a similar un-answered question que se ve el desarrollador está teniendo el mismo problema, pero ninguna solución publicados. ¿Alguna idea de dónde estoy yendo mal?

Answer 1

Jason is right. Por defecto, la validación de jquery omite/ignora los elementos de entrada no visibles. Esto va para input type="hidden" elementos, o incluso cuadros de texto que tienen/heredan display:none; CSS. Hay un ajuste llamado ignore, y su valor por defecto es el siguiente:

ignore: ':hidden' 

Puede anular esta configuración en su página con el siguiente script:

$.validator.setDefaults({ 
    ignore: '' 
}); 

Esto le dice jquery de validación no hacer caso de la validación para elementos no visibles. Si usa esta secuencia de comandos, la validación de jquery debe automáticamente, validar el campo discretamente sin tener que validarlo manualmente cada vez que cambie el valor del campo datepicker.

Answer 2

En MVC3 los campos de formulario ocultos no son validados por el script de validación del cliente, según tengo entendido. ¿Por qué no simplemente ocultar el campo de texto, si eso es todo lo que quieres hacer?

@Html.TextBox("", dt, new { @class = "datefield", @type = "date", @id = id, style="display:none;" }) 

o si desea mantenerlo como un campo @ Html.Hidden tendrá que llamar manualmente el plugin de validación en el formulario cada vez que se cambia el selector de fechas.

$("form").validate().form();