今日の日付または以前の入力の日付を選択できません

Question

私たちのアプリケーションにはDaterangepickerが使用されています。

multitrip日付ピッカーコンポーネント（3つの入力フィールド）

1. TripOneの作成 - 選択した日付（例：2月19日）
2. TripTwoを - 'TripOne' 選択した日付から開始する必要があります。
3. TripThree - 選択した「TripTwo」から開始する必要があります。

上記のことは問題ありません。

ただし、以下の問題はこのプラグインでは機能しません。

1. TripOne - 今日の日付（動作しない）
2. TripTwoを選択 - 2月20日はTripOneに選択した場合、私はTripTwoに同じ2月20日を選択することができ傾きます。
3. TripThree - TripTwoに似ています。

JS：

var nowDate = new Date(); 
var today = new Date(nowDate.getFullYear(), nowDate.getMonth(), nowDate.getDate(), 0, 0, 0, 0); 
var maxLimitDate = new Date(nowDate.getFullYear(), nowDate.getMonth(), nowDate.getDate()+360, 0, 0, 0, 0); 

$('input[name="tripOne"]').daterangepicker({ 
    "autoApply": true, 
    "autoUpdateInput": false, 
    "singleDatePicker": true, 
    "minDate": today, 
    "maxDate": maxLimitDate, 
    "locale": { 
     format: 'DD MMM YYYY' 
    } 
    },function(start) { 
     $("#tripOne").val(start.format('DD MMM YYYY')); 
     $('#tripOne').parent().parent().removeClass('has-error'); 
     var returnTripStartDate = new Date(Date.parse(start)); 
     $('input[name="tripTwo"]').daterangepicker({ 
     "autoApply": true, 
     "autoUpdateInput": false, 
     "singleDatePicker": true, 
     "minDate": returnTripStartDate, 
     "maxDate": maxLimitDate, 
     "locale": { 
      format: 'DD MMM YYYY' 
     } 
     },function(end) { 
      $("#tripTwo").val(end.format('DD MMM YYYY')); 
      $('#tripTwo').parent().parent().removeClass('has-error'); 
      var returnTripStartDate2 = new Date(Date.parse(start)); 
      $('input[name="tripThree"]').daterangepicker({ 
      "autoApply": true, 
      "autoUpdateInput": false, 
      "singleDatePicker": true, 
      "minDate": returnTripStartDate2, 
      "maxDate": maxLimitDate, 
      "locale": { 
       format: 'DD MMM YYYY' 
      } 
      },function(end) { 
       $("#tripThree").val(end.format('DD MMM YYYY')); 
       $('#tripThree').parent().parent().removeClass('has-error'); 
      }); 
      $(function() { 
       $('.calendar.right').show(); 
      }); 
     }); 
     $(function() { 
     $('.calendar.right').show(); 
     }); 
     $('input[name="tripOne"]').on('apply.daterangepicker', function(ev, picker) { 
     $(this).val(picker.startDate.format('DD MMM YYYY')); 
     }); 
     $('input[name="tripTwo"]').on('apply.daterangepicker', function(ev, picker) { 
     $(this).val(picker.startDate.format('DD MMM YYYY')); 
     }); 
     $('input[name="tripThree"]').on('apply.daterangepicker', function(ev, picker) { 
     $(this).val(picker.startDate.format('DD MMM YYYY')); 
     }); 
    }); 
    $(function() { 
     $('.calendar.right').show(); 
    }); 

​​

Answer 1

問題は、日付ピッカーそのものではありません...あなたはそれを使用している方法です。あなたのコードでは、トリップ＃1の日付ピッカーから何かを選択するたびに、それが第3のものに影響を与えようとする第2のものに影響を与えようとします:(

正しいアプローチ：文書のすべての3つの日付ピッカーreadyイベント..しかし待つ：どのようにあなたのロジックに従って、各DatePickerの設定を変更します

まあ、それはのように簡単です：Change option dynamically in JQuery UI DatePicker fails

は長い話を短くしてください - あなたは日付ピッカーの値を変更するたびに、次のピッカーの設定を変更します？ ：

function(start) 
{ 
    $("#tripOne").val(start.format('DD MMM YYYY')); 

    // ..... 

    $('input[name="tripTwo"]').datepicker("destroy"); 

    $("#dteEnd").datepicker({ 
    // new options here - with your desired value 
    }); 

    // ......