daterangepicker 中的 StartDate 在第二个输入中不起作用答案

【问题标题】：StartDate in daterangepicker doesn't work in the second inputdaterangepicker 中的 StartDate 在第二个输入中不起作用
【发布时间】：2018-09-01 02:00:52
【问题描述】：

当我尝试在第一个输入中创建 startDate 它可以工作，但我需要 startDate 进行第二个输入，结果不起作用。这是我的代码

$('.date-picker').daterangepicker({
  singleDatePicker: true,
  minDate: moment().subtract(1, 'years'),
  maxDate: moment().subtract(1, 'days'),
  locale: {
        format: 'DD-MM-YYYY'
      }
  }, function(chosen_date) {
      $('.date-picker').val(chosen_date.format('DD-MM-YYYY'));
    })

  $('.date-picker-2').daterangepicker({
    minDate: departpicker,
    /*why is not working?*/
    startDate: moment(departpicker, 'DD-MM-YYYY').add(6, 'days'),
    maxDate: moment(departpicker, 'DD-MM-YYYY').add(6, 'days')
})

这是我的完整代码Fiddle

我希望当我选择 06-08-2018 时，第二个输入中的 startDate 是 12-08-2018。喜欢这张照片

【问题讨论】：

标签： javascript jquery datepicker momentjs daterangepicker

【解决方案1】：

您必须更改第二个日期时间选择器的开始日期。目前它设置为初始日期，希望这会有所帮助。

var drp = $('.date-picker-2').data('daterangepicker');
drp.setStartDate(moment(departpicker, 'DD-MM-YYYY').add(6, 'days'));

【讨论】：

嗨@Sachi，如果我更改 minDate，就只有一天。 6天的范围没了，有办法吗？
嗨@Sachi 仍然不起作用。你想展示演示吗？我尝试了您创建的代码。 jsfiddle.net/dedi_wibisono17/67drajgz/39 。如果我错了，请纠正我。谢谢
你已经添加了 drp.setStartDate(moment(departpicker, 'DD-MM-YYYY').add(6, 'days')); drp.setStartDate(departpicker);删除第二行只保留 drp.setStartDate(moment(departpicker, 'DD-MM-YYYY').add(6, 'days'));
哦，我明白了，它起作用了，我的错。谢谢你的解释。

【解决方案2】：

作为.date-picker-2 的minDate，您只提供了从第一个日期选择器输出的字符串...而不是日期对象。

这是我所做的更改：

minDate: moment(departpicker, 'DD-MM-YYYY'),  //departpicker,
/*why is not working?*/

我还评论了这个设置日期的额外尝试：

//var drp = $('.date-picker-2').data('daterangepicker');
//drp.setStartDate(departpicker);
//drp.setEndDate(departpicker);

它在下面工作正常：

var autoupdate = false;

function date1(){
  $('.date-picker').daterangepicker({
    singleDatePicker: true,
    showDropdowns: true,
    minDate: moment().subtract(1, 'years'),
    autoApply: true,
    disabledDays: 'today',
    maxDate: moment().subtract(1, 'days'),
    autoUpdateInput: autoupdate,
    locale: {
      format: 'DD-MM-YYYY'
    }
  }, function(chosen_date) {
    $('.date-picker').val(chosen_date.format('DD-MM-YYYY'));
  });
}
date1();

$('.date-picker').on('apply.daterangepicker', function(ev, picker) {

  if ($('.date-picker').val().length == 0 ){
    autoupdate = true;
    console.log('true');
    date1();
  }
  var departpicker = $('.date-picker').val();
  
  $('.date-picker-2').daterangepicker({
    minDate: moment(departpicker, 'DD-MM-YYYY'),	//departpicker,
    /*why is not working?*/
    startDate: moment(departpicker, 'DD-MM-YYYY').add(6, 'days'),
    maxDate: moment(departpicker, 'DD-MM-YYYY').add(6, 'days'),
    singleDatePicker: true,
    showDropdowns: true,
    autoApply: true,
    locale: {
      format: 'DD-MM-YYYY'
    }
  });

  //var drp = $('.date-picker-2').data('daterangepicker');
  //drp.setStartDate(departpicker);
  //drp.setEndDate(departpicker);
});

<link href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>

<input type="text" class="date-picker">
<input type="text" class="date-picker-2">

【讨论】：