今天的日期或之前输入的选定日期无法选择

Question

我对我们的应用程序使用Daterangepicker。

创建multitrip日期选取器组件（3个输入字段）

1. TripOne - 选择日期（例如：2月19日）
2. TripTwo - 必须从 'TripOne' 选定的日期开始。
3. TripThree - 必须从'TripTwo'选定的日期开始。

上面的东西工作正常。

但是，下面的问题不适用于这个插件。

1. TripOne - 选择今天的日期（不工作）
2. TripTwo - 如果TripOne选择2月20日，我不能能够在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日期选择器的它试图影响其试图影响第三:(

正确的做法第二EVERY TIME：初始化所有3个datepickers在文档ready事件..但等待：你将如何按照你的逻辑改变每个日期选择器配置

那么它很简单，只要：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 
    }); 

    // ......