以前の日付ピッカーで選択した日付の最小値を設定する

Question

私は2つの日付ピッカーを持っています。 A startdateおよびenddateである。

コードを設定する方法は、最初のものが変更されるまで2番目のdatepickerが開始されないようにすることです。 enddate datepickerは、現在の日付でstartdateに初期化されています。唯一の問題は、最初の日付ピッカーの時刻を変更するとmindateがenddateに更新されないことです。

$(function(){ 
    $("#startdate").datepicker({ minDate: currentTime }); 

     //When the startdate changes change the mindate for the enddate picker 
     $("#startdate").change(function(){ 
      startTime = ($("#startdate").val()); 
      $("#enddate").datepicker({ minDate: startTime }); 

     }); 

     //$("#enddate").datepicker({ minDate: currentTime }); 
    }); 

Answer 1

あなたは既に初期化ウィジェットのminDateオプションを更新するために、ドキュメント（http://jqueryui.com/demos/datepicker/#method-option）で説明したようにoption方法を使用する必要があります：私は、フロントvar文を入れ

$("#startdate, #enddate").datepicker({ minDate: currentTime }); 

$('#startdate').change(function() { 
    var startTime = ($("#startdate").val()); 
    $("#enddate").datepicker('option', 'minDate', startTime); 
}); 

お知らせstartTime変数の値であるため、イベントハンドラのローカルスコープで宣言されます。また、両方のDatePickerが初期化され、#startdate要素が変更されるたびに、#enddateウィジェットが更新されたminDateオプションを取得します。ここで

はデモです：代わりに、テキストボックスのchangeイベントのhttp://jsfiddle.net/VP25m/

Answer 2

EDIT：日付ピッカーにリフレッシュ（）関数を使用してみてください：

$("#startdate").change(function(){ 
    startTime = ($("#startdate").val()); 
    $("#enddate").datepicker({ minDate: startTime }); 
    $("#enddate").datepicker('refresh'); 

    }); 

BELOW

OLD ANSWER：あなたはおそらく、あなたができるように可変に終了日の日付ピッカーを設定したいと思うでしょう

開始日が変更されると、それを破棄して再初期化します。

$("#startdate").change(function(){ 
    startTime = ($("#startdate").val()); 
    if($("#enddate").datepicker("enabled")) { 
      endDatePicker.datepicker("destroy"); 
    } 
    var endDatePicker = $("#enddate").datepicker({ minDate: startTime }); 

    }); 

Answer 3

使用datepickerさんonSelectイベント。この場合、selectedの日付を最初の引数として取得し、minDateのenddateデータピッカーに設定することができます。

$("#startdate").datepicker({ 
    minDate: currentTime, 
    onSelect: function(date){ 

     //if the datepicker is not initialized 
     $("#enddate").datepicker({ minDate: date }); 

     //if the datepicker is already initialized 
     $("#enddate").datepicker("option", "minDate", date); 
    } 
}); 

Demo

参考：http://jqueryui.com/demos/datepicker/#event-onSelect