Выбор даты окончания начальной загрузки / начальной загрузки с диапазоном дат - PullRequest
Новая
       26

Выбор даты окончания начальной загрузки / начальной загрузки с диапазоном дат

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

Я использую Bootstrap Datepicker , и у меня есть 2 input поля (дата начала и дата окончания), которые используют опцию диапазона дат (inputs:), которая работает очень хорошо.Я пытаюсь получить поле начала, чтобы требовать выбора даты после сегодняшней даты (поэтому только дата сегодня или дата в прошлом).

Вот jQuery, который я использую: 

  $('.input-daterange').datepicker({
    format: 'mm-dd-yyyy',
    inputs: $('.date-control'),
    todayBtn: true,
    todayHighlight: true
  });

Вот поля формы: 

    <div class="col-md-6 mb-3">
      <label for="date-start"><span class="text-danger">*</span>Project Start Date</label>
      <div class="input-group input-daterange">
        <div class="input-group-prepend">
          <span class="input-group-text">Started</span>
        </div>
        <input type="text" class="form-control date-control start-daterange" name="date-start" id="date-start" value="" required="">
        <div class="invalid-feedback">
          Project Start Date is required.
        </div>
      </div>
    </div>
    <div class="col-md-6 mb-3">
      <label for="date-end"><span class="text-danger">*</span>Project End Date</label>
      <div class="input-group input-daterange end-daterange">
        <div class="input-group-prepend">
          <span class="input-group-text">Finished</span>
        </div>
        <input type="text" class="form-control date-control" name="date-end" id="date-end" value="" required="">
        <div class="invalid-feedback">
          Project End Date is required.
        </div>
      </div>
    </div>

Я уже пытался использовать endDate: "0d"; для ограниченияполе даты начала, но если я сделаю это, оно также ограничит поле даты окончания, поскольку они связаны с inputs: $('.date-control').Я видел в документах , что я мог бы использовать <input type="text" class="form-control" data-date-end-date="0d">, но это тоже не работает, может быть, потому что я использую опцию inputs?

Так что мой вопрос есть простой способпродолжать использовать параметр диапазона дат и иметь возможность ограничить поле даты начала для выбора сегодняшней даты и любой другой даты в прошлом?

Я уже рассматривал эти другие вопросы, относящиеся к таким смежным вопросам как ограничить загрузкуВыбор даты от будущей даты и Как иметь динамическую максимальную дату окончания в Bootstrap Date Picker .Также я использую последнюю версию загрузчика даты загрузки (v1.8).

1 Ответ

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

Кажется, что опция input и атрибут data-date-end-date не работают вместе.Но есть обходной путь, и вы получите тот же результат.Вы можете использовать один и тот же класс для обоих входов, и вы можете создавать средства выбора даты, используя этот класс.Кроме того, вы будете использовать атрибут data-date-end-date только в начале ввода, например:

Код Jquery: 

$('.date-control').datepicker({
  format: 'mm-dd-yyyy',
  todayBtn: true,
  todayHighlight: true
});

Поля формы: 

<div class="col-md-6 mb-3">
  <label for="date-start"><span class="text-danger">*</span>Project Start Date</label>
  <div class="input-group input-daterange">
    <div class="input-group-prepend">
      <span class="input-group-text">Started</span>
    </div>
    <input type="text" class="form-control date-control start-daterange" name="date-start" id="date-start" required="" data-date-end-date="0d">
    <div class="invalid-feedback">
      Project Start Date is required.
    </div>
  </div>
</div>
<div class="col-md-6 mb-3">
  <label for="date-end"><span class="text-danger">*</span>Project End Date</label>
  <div class="input-group input-daterange end-daterange">
    <div class="input-group-prepend">
      <span class="input-group-text">Finished</span>
    </div>
    <input type="text" class="form-control date-control" name="date-end" id="date-end" required="">
    <div class="invalid-feedback">
      Project End Date is required.
    </div>
  </div>
</div>

ps: я удалил атрибут значения из обоих входов, просто чтобы прояснить его.

...