StartDate в daterangepicker не работает во втором вводе

Когда я пытаюсь в первом вводе создать 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 datepicker jquery momentjs daterangepicker
person dedi wibisono    schedule 01.09.2018    source источник

Ответы (2)


arrow_upward
3
arrow_downward

вам нужно изменить дату начала второго средства выбора даты и времени. В настоящее время он устанавливает начальную дату, надеюсь, это поможет.

var drp = $('.date-picker-2').data('daterangepicker');
drp.setStartDate(moment(departpicker, 'DD-MM-YYYY').add(6, 'days'));
person Sachi.Dila    schedule 01.09.2018
comment
Привет @Sachi, если я изменю minDate, это будет всего один день. диапазон 6 дней ушел, есть идея? - person dedi wibisono; 01.09.2018
comment
Привет @Sachi все еще не работает. Вы хотели бы показать демо?. У меня есть пробный код, который вы создаете. jsfiddle.net/dedi_wibisono17/67drajgz/39 . поправьте меня, если я ошибаюсь. Спасибо - person dedi wibisono; 01.09.2018
comment
вы добавили drp.setStartDate(moment(departpicker, 'DD-MM-YYYY').add(6, 'days')); drp.setStartDate (отборщик); удалить вторую строку, оставить только drp.setStartDate(moment(departpicker, 'DD-MM-YYYY').add(6, 'days')); - person Sachi.Dila; 01.09.2018
comment
о, я вижу, это работает, моя вина. Спасибо за ваше объяснение. - person dedi wibisono; 01.09.2018

arrow_upward
0
arrow_downward

В качестве minDate для .date-picker-2 вы предоставили только строку, выведенную из первого средства выбора даты... Вместо объекта даты.

Вот изменение, которое я сделал:

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">

person Louys Patrice Bessette    schedule 01.09.2018