jQuery Datepicker onSelect no funciona

Estoy usando el evento onSelect para establecer el valor mínimo de EndDate igual al valor establecido como StartDate . Tengo el mismo código en varias páginas, pero en una de ellas no funciona. Si selecciono un valor en la StartDate , el selector de fecha no se muestra cuando voy en el campo EndDate finalización. Las páginas se cargan y manejan con ajax.

Mi Código es el siguiente:

 $(document).ready(function() { $("#strStartDate").datepicker({ dateFormat: 'dd/mm/yy', constrainInput: true, firstDay: 1, hideIfNoPrevNext: true, onSelect: function(){ $("#strEndDate").datepicker( "option", "minDate", $("#strStartDate").val()); } }); $("#strEndDate").datepicker({ dateFormat: 'dd/mm/yy', constrainInput: true, firstDay: 1, hideIfNoPrevNext: true }); }); 

Cualquier ayuda es muy apreciada. Gracias de antemano.

Usando las ideas detrás de tus comentarios, logro hacer casi lo que quiero

 $("#strStartDate").datepicker({ dateFormat: 'dd/mm/yy', constrainInput: true, firstDay: 1, hideIfNoPrevNext: true, }); $("#strEndDate").datepicker({ dateFormat: 'dd/mm/yy', constrainInput: true, firstDay: 1, hideIfNoPrevNext: true, beforeShow: function (input, inst) { inst.settings.minDate = $("#strStartDate").val(); } }); 

El código anterior impide que el usuario ponga una fecha de finalización más pequeña que la fecha de inicio; sin embargo, si ya existía un valor en la fecha de finalización y usted cambia la fecha de inicio a un valor mayor que la fecha de finalización, debe establecer la fecha de finalización igual al inicio fecha. Esto es lo que intentaba hacer con el código siguiente en mi código anterior

 onSelect: function(){ $("#strEndDate").datepicker( "option", "minDate", $("#strStartDate").val()); } 

¿Alguna idea de cómo hacer esto usando la instancia y no inicializar de nuevo?

Ok chicos … Buenas noticias … al menos para mí 🙂

 $("#strStartDate").datepicker({ dateFormat: 'dd/mm/yy', constrainInput: true, firstDay: 1, hideIfNoPrevNext: true, onSelect: function(){ if ($("#strStartDate").val() > $("#strEndDate").val()){ $("#strEndDate").val($("#strStartDate").val()); } } }); $("#strEndDate").datepicker({ dateFormat: 'dd/mm/yy', constrainInput: true, firstDay: 1, hideIfNoPrevNext: true, beforeShow: function (input, inst) { inst.settings.minDate = $("#strStartDate").val(); } }); 

Este es el código final. Solo crea una instancia de cada seleccionador de fecha y realiza la validación necesaria cuando desea usarlo como selector de intervalo de fechas.

Gracias de nuevo por tus pautas

No estoy seguro de que esto resuelva tu problema, pero prueba esto:

 $("#strStartDate").datepicker({ dateFormat: 'dd/mm/yy', constrainInput: true, firstDay: 1, hideIfNoPrevNext: true, onSelect: function(selectedDate){ $("#strEndDate").datepicker("option", "minDate",selectedDate); } }); 

Esto debería hacer lo que necesitas:

 function fromTo(startDate, endDate) { $(startDate + ", " + endDate).datepicker({ onClose: function (dateText, inst) { if ("#" + inst.id === startDate) { $(endDate).datepicker("option", "minDate", $(startDate).val()); } }, beforeShow: function (input, inst) { if (inst.id == $(endDate).get(0).id) { inst.settings.minDate = $(startDate).val(); } }, dateFormat: 'mm/dd/yy', constrainInput: true, firstDay: 1, hideIfNoPrevNext: true }); } 

Utilice fromTo("#startdate", "#enddate");