JQuery DatePicker на основе другого значения DatePickers - PullRequest
Новая
       10

JQuery DatePicker на основе другого значения DatePickers

0 голосов
/ 25 февраля 2019

У меня есть текстовое поле с указателем даты на моей странице.Первоначально, есть только один, но может быть добавлено больше динамически.Первый указатель даты настроен так, что пользователь не может выбрать дату до сегодняшнего дня, но может выбрать любую дату в будущем.

Как настроить следующие средства выбора даты, чтобы пользователь не мог выбрать дату додата, выбранная в предыдущей дате выбора?Например: если сегодня 25.02.2019, и я выбираю 01.03.2019 в первом средстве выбора даты, то второе средство выбора даты не сможет выбирать что-либо до 01.03.2019.

Если я выберу 10.03.2019во втором DatePicker, то следующий сгенерированный DatePicker не должен быть в состоянии выбрать что-либо до 10.03.2019.вернуть любое значение в вызове console.log

1 Ответ

0 голосов
/ 26 февраля 2019

Если я понял вашу цель, это рабочий пример того, как я намеревался использовать событие onSelect.

Надеюсь, это поможет вам 

$(".flightDate").datepicker({
  minDate: 0,
  onSelect: function() {
    $(".dynamic-flightdate").datepicker("option", "disabled", false);
    $(".dynamic-flightdate").datepicker("option","minDate", $(this).datepicker("getDate"))
  }

});


$(".dynamic-flightdate").datepicker({ minDate: 0, disabled: true });


/*
$('body').on('focus',
  '.dynamic-flightdate',
  function() {
    $(this).datepicker({
      numberOfMonths: 1,
      firstDay: 1,
      defaultDate: 0,
      minDate: function() {
        $(this).prev(".datepicker").val();
        console.log($(this).prev(".datepicker").val());
      },
      changeMonth: true,
      changeYear: true,
      dateFormat: 'dd.mm.yy'
    });
    $(this).datepicker('show');
  });*/
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js" integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30=" crossorigin="anonymous"></script>

<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">


<input type="text" class="flightDate" />
<input type="text" class="dynamic-flightdate" />
...