jQuery UI Datepicker Cambio de mes requiere 2 clics

Tengo dos campos de entrada, uno para la llegada y otro para la salida. Cuando un usuario ingresa la fecha de llegada, abro el selector de fechas de fecha de salida con las restricciones necesarias.

Pero cuando abro el segundo selector de fecha, cambiar programáticamente al próximo mes requiere dos clics y activa el evento de mostrar nuevamente (?). Sin embargo, seleccionar una fecha dentro del mes actual funciona como se esperaba.

Aquí hay un violín para mostrar el problema: http://jsfiddle.net/rrPAy/3/

HTML:

<form>
   <label for="arrivalDate">Arrival</label>
   <input type="text" name="arrivalDate" id="arrivalDate" autocomplete="off">
   <br>
   <label for="departureDate">Departure</label>
   <input type="text" name="departureDate" id="departureDate" autocomplete="off">
</form>

JAVASCRIPT:

$("#arrivalDate,#departureDate").datepicker({
    minDate: +1,
    firstDay: 1,
    dateFormat: "dd.mm.yy",
    showOn: 'both',
    gotoCurrent: true,
    buttonImageOnly: true,
    buttonText: 'Date',
    numberOfMonths: 1,
    inline: true,
    changeMonth: true,
    changeYear: true,
    beforeShow: function customRange(input)
    {
        if (input.id == 'departureDate') {
            var arrivalDate = jQuery('#arrivalDate').datepicker("getDate");
            if(arrivalDate) {
                arrivalDate.setDate(arrivalDate.getDate()+1); // Add 1 Day for Departure Date
                return {minDate: arrivalDate};
            }
        }
    },
    onClose: function() {
        if ($(this).attr('id') == 'arrivalDate') {
            $("#departureDate").datepicker("show");
            $("#departureDate").focus();
        }
    }
});

preguntado el 16 de abril de 13 a las 08:04

2 Respuestas

prueba esto:

$("#arrivalDate,#departureDate").datepicker({
        minDate: +1,
        firstDay: 1,
        dateFormat: "dd.mm.yy",
        showOn: 'both',
        gotoCurrent: true,
        buttonImageOnly: true,
        buttonText: 'Date',
        numberOfMonths: 1,
        inline: true,
        changeMonth: true,
        changeYear: true,
        onSelect: function(dateText, inst) {
            if ($(this).attr('id') == 'arrivalDate') {
                var d =  $('#arrivalDate').datepicker('getDate');
                d.setDate(d.getDate()+1);
                $('#departureDate').datepicker('option', 'minDate', d);
                $('#departureDate').datepicker('show');
                inst.preventDefault();
            }
        }
    });

ver violín

Respondido 16 Abr '13, 09:04

Esto funciona pero arroja un error JS ya que preventDefault no es una función dentro del objeto de la instancia. - Fernando Chávez Herrera

Uso algo como esto dentro del evento onClose

setTimeout(function () {
    $('.datepicker').datepicker("show");
}, 50);

Respondido el 26 de junio de 20 a las 13:06

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.