JQuery Datepicker Problema OnSelect y TextChanged

Question

Desde que agregué un OnSelect a mi Datepicker, el evento TextChanged ya no se dispara para este control. Mi código es el siguiente:

$(function() { 
    $("#<%=txtStartDate.ClientID %>").datepicker({ 
     minDate: 0, 
     dateFormat: 'dd-M-yy', 
     onSelect: function(dateText, inst) { 
      var theDate = new Date(Date.parse($(this).datepicker('getDate'))); 
      $("#<%=txtEndDate.ClientID %>").datepicker('option', 'minDate', theDate); 
     } 
    }); 

    $("#<%=txtEndDate.ClientID %>").datepicker({ 
     dateFormat: 'dd-M-yy' 
    }); 
}); 

<%-- etc ---- %> 

<asp:TextBox ID="txtStartDate" runat="server" AutoPostBack="true" OnTextChanged="txtStartDate_TextChanged"></asp:TextBox> 

Mi otro selector de fechas de eventos (txtEndDate) TextChanged se desencadena por lo que sólo puede ponerlo abajo a la onselect siendo definida para el control txtStartDate.

Agradecemos enormemente cualquier ayuda en este caso. ¡Aclamaciones!

Answer 1

Después de una breve comprobación de la interfaz de usuario jQuery DatePicker fuentes, la solución es simplemente disparar el evento de cambio de ti mismo

... 
onSelect: function(dateText, inst) { 
    var theDate = new Date(Date.parse($(this).datepicker('getDate'))); 
    $("#<%=txtEndDate.ClientID %>").datepicker('option', 'minDate', theDate); 
    if (inst.input) 
     inst.input.trigger('change'); 
} 
... 

La razón de esto son las siguientes líneas en la fuente de jQuery UI DatePicker

if (onSelect) 
    // trigger custom callback 
    onSelect.apply((inst.input ? inst.input[0] : null), [dateStr, inst]); 
else if (inst.input) 
    // fire the change event 
    inst.input.trigger('change'); 

Como puede ver jQuery UI Datepicker desencadena el evento change por defecto si la instancia de datepicker es un campo input pero no lo activa si especificó un controlador personalizado onSelect (como lo hizo).

Se podría argumentar que en realidad este es el comportamiento correcto, ya que garantiza la máxima capacidad de configuración. Puede decidir si desea que el evento change suceda o no de esta manera.

Pero acepto que este comportamiento tal vez deba documentarse.

Answer 2

Es posible que sólo tiene que añadir

$('<%=txtStartDate.ClientID %>').trigger('change');

hasta el final de onSelect función. Consideremos el siguiente ejemplo de trabajo: http://jsbin.com/oqunu/ o editar la versión http://jsbin.com/oqunu/edit

O mover o la lógica de las funciones activadas por TextChanged y deshacerse de onSelect. Me gusta aquí: http://jsbin.com/iyajo; editar la versión http://jsbin.com/iyajo/edit

Answer 3

En una línea similar, encontré que si conecta el DatePicker a un campo de entrada de texto y especifica .selectMultiple, se produce un comportamiento extraño. Específicamente, cuando hace clic en una celda ya seleccionada (para deseleccionarla), parpadea pero permanece seleccionada. Esto ocurre porque primero la celda no se selecciona, pero luego DatePicker arroja un evento de 'cambio'. ¡El evento de cambio vuelve a activar la celda actual porque el calendario está conectado a una entrada de texto!

Esto tiene sentido, en cierto modo: es probable que no deba incluir selecciones múltiples en un solo cuadro de texto. Pero el comportamiento no está documentado y es bastante difícil de rastrear a menos que ya sepa cómo reconoce DatePicker los cuadros de texto.