2012-02-01 7 views
1

私は4つの日付ピッカーのカレンダーを取っていますが、前の選択した日付の日付を無効にしたいのですが... JQueryの日付ピッカーからいくつか考えましたが、 4つの日付ピッカー。だから、いずれかのソリューションは、ちょうど私と一緒に共有している場合... 2つの日付ピッカーの場合 が、これはコードです:JQueryカレンダーの前の日付を無効にする

$(function() { 
    var dates = $("#txt1, #txt2").datepicker({ 
     minDate:0, 
     maxDate:"+1Y", 
     defaultDate: "+1w", 
     dateFormat:'dd-mm-yy', 
     numberOfMonths: 3, 
     onSelect: function(selectedDate) { 
      var option = this.id == "txt1" ? "minDate" : "maxDate", 
       instance = $(this).data("datepicker"), 
       date = $.datepicker.parseDate(
        instance.settings.dateFormat || 
        $.datepicker._defaults.dateFormat, selectedDate, instance.settings); 
      dates.not(this).datepicker("option", option, date); 
     } 
    }); 
}); 

答えて

1

テキスト入力は、このような単純な何かがうまくいく、その後txt4を通じてtxt1idsをお持ちの場合:

onSelect: function(date) { 
    for(var i = 0; i < dates.length; ++i) { 
     if(dates[i].id < this.id) 
      $(dates[i]).datepicker('option', 'maxDate', date); 
     else if(dates[i].id > this.id) 
      $(dates[i]).datepicker('option', 'minDate', date); 
    } 
} 

デモ:http://jsfiddle.net/ambiguous/Rtbph/

うまく比較するためにあなたのid属性を必要としない代替を使用しますはthusly:

var dates = $('#first, #second, #third, #fourth').datepicker({ 
    // ... 
    onSelect: function(date) { 
     var me = dates.index(this); 
     for(var i = 0; i < dates.length; ++i) { 
      if(i < me) 
       $(dates[i]).datepicker('option', 'maxDate', date); 
      else if(i > me) 
       $(dates[i]).datepicker('option', 'minDate', date); 
     } 
    } 
}); 

は、次に、あなただけのあなたの最初のセレクタ、$('#first, #second, #third, #fourth')は、右の順に、適切左に入力を入れていることを確認する必要があると思います。

デモ:http://jsfiddle.net/ambiguous/xaVZM/

+0

偉大なデモ。ありがとう。それが私が探していたものです。 – mtk

関連する問題