3

1 つのページに複数の日付ピッカーがあります。などのオプションを設定するユーザークラス名が表示されます。

$('.datepickers').datepicker({
        dateFormat: "yy-mm-dd",
        showButtonPanel: true,
        changeMonth: true,
        changeYear: true,
        showOtherMonths: true,
        selectOtherMonths: true,
        showWeek: true
});

次に、そのうちの 2 つに onSelect イベントを設定します。

$('#to').datepicker({
    onSelect: function(selectedDate) {
        $('#from').datepicker("option", "minDate", selectedDate);
    }
});

他の人のための同様の onSelect イベント設定。

ただし、これは機能しません。すべてのオプションをIDで個別に設定する以外に、これを修正する方法について何か提案はありますか?

4

2 に答える 2

1

可能な解決策を示すために、ここで機能デモを作成しました。

jsfiddleをクリックしてください

複数の datepicker メソッドを作成する必要はありません。「onSelect」メソッドを使用して、次のことを行います。

  1. 現在の日付ピッカーに「#to」があるかどうかをテストします
  2. その場合は、この日付ピッカーの「dateText」値を使用して、「#from」日付ピッカーを初期化します
  3. 現在の「inst」値を使用して、dom を「#from」日付ピッカーまでトラバースし、その値を設定します。

これらは重要な行でした：

onSelect: function(dateText, inst) {
   if(inst.id === 'to'){
     $('.datepickers').filter($('input#from')).datepicker("option", "minDate", dateText);
  }          
}
于 2012-06-20T02:02:55.490 に答える
1

次の構文を試しましたか？datepicker ウィジェットを再度 _init したくありません。オプションを変更したいだけです。これは、jquery ui ウィジェットでそれを行う方法です。

    $('#to').datepicker('option', 'onSelect', function(selectedDate) {
            $('#from').datepicker("option", "minDate", selectedDate);
        });
于 2012-06-20T10:12:16.567 に答える