2009-12-11 11 views
6

DatePickerにOnSelectを追加して以来、TextChangedイベントはこのコントロールでは発生しなくなりました。JQuery Datepicker OnSelectとTextChangedの問題

$(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> 

私の他の日付ピッカー(txtEndDate)TextChangedイベントは、火がこれだけONSELECTがtxtStartDate制御のために定義されることにそれを置くことができない次のように私のコードです。

この件に関するお手伝いをいただきありがとうございます。乾杯!

答えて

6

のjQuery UI日付ピッカーは、ソリューションをソースのショートチェックだけで変更イベントを発射するしたら、自分は

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

この理由は、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'); 
に次の行です

jQueryのUI Datepickerはdatepickerインスタンスがinputフィールドの場合はデフォルトでchangeイベントを発生させますが、カスタムonSelectハンドラを指定した場合は起動しません。

実際には、これが正しい構成であることを保証するので、実際には正しい動作であると主張できます。 changeイベントをこのようにするかどうかを決めることができます。

しかし、私はこの動作が文書化されるべきであることに同意します。

2

あなただけonSelect関数の終わりに

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

を追加することができます。以下の作業例を考えてみましょう: http://jsbin.com/oqunu/または編集版http://jsbin.com/oqunu/edit

または、TextChangedによってトリガされた機能にロジックを移動し、onSelectを削除します。ここのように: ;編集版http://jsbin.com/iyajo/edit

0

同様に、テキスト入力フィールドにDatePickerを添付して.selectMultipleと指定すると、奇妙な動作が発生することが判明しました。具体的には、既に選択されているセルをクリックすると(選択解除するために)、そのセルはちらつきますが、選択されたままです。これは、最初にセルが選択解除された後にDatePickerが 'change'イベントをスローするために発生します。カレンダーがテキスト入力に添付されているため、変更イベントによってカレントセルが再びオンになります。

これは意味があります.1つのテキストボックスに複数の選択肢を置いてはいけません。しかし、この動作は、ドキュメント化されておらず、DatePickerがテキストボックスをどのように理解しているかを既に理解していない限り、トレースするのが難しいです。

関連する問題