Как изменить атрибут multidate путем ввода onchange - PullRequest
Новая
       22

Как изменить атрибут multidate путем ввода onchange

0 голосов
/ 08 ноября 2019

Я пытаюсь выбрать многодатную сборку Bootstrap. Мое условие заключается в получении значения onchange для установки атрибута multidate в качестве входных данных.

Например, если значение onchange равно 2, я могу выбрать только 2 даты. Если значение onchange 3, я могу выбрать до трех дат. Я могу выбрать по умолчанию 2.

Я пробовал этот код, но принимает только объявления по умолчанию 

$("#Txt_Date").datepicker({
  format: 'd-mm-yyyy',
  inline: false,
  lang: 'en',
  step: 2,
  multidate: 2,
  closeOnDateSelect: true,
  onSelect: function(dateText, inst) {
    $(this).change();
  }
});

$('#numdays').change(function(argument) {
  alert($(this).val());
  var numdays = $(this).val();
  if (numdays == 2) {
    $("#Txt_Date").datepicker({
      format: 'd-mm-yyyy',
      inline: false,
      lang: 'en',
      step: 2,
      multidate: numdays,
      closeOnDateSelect: true
    });
  } else if (numdays == 3) {
    $("#Txt_Date").datepicker({
      format: 'd-mm-yyyy',
      inline: false,
      lang: 'en',
      step: 2,
      multidate: numdays,
      closeOnDateSelect: true
    });
  } else {
    $("#Txt_Date").datepicker({
      format: 'd-mm-yyyy',
      inline: false,
      lang: 'en',
      step: numdays,
      multidate: 5,
      closeOnDateSelect: true
    });
  }
});

1 Ответ

0 голосов
/ 08 ноября 2019

Попробуйте использовать следующий код: 

mul_dp();

$('#numdays').change(function() {
    $("#Txt_Date").datepicker('setDate', null); 
    mul_dp(Number($(this).val())); 
});

function mul_dp(num_days = 2){

  $('#numdays').val(num_days);

  $("#Txt_Date").datepicker('destroy').datepicker({
  format: 'd-mm-yyyy',
  inline: false,
  lang: 'en',
  step: num_days,
  multidate: num_days,
  closeOnDateSelect: true,
  onSelect: function(dateText, inst) {
      $(this).change();
    }
  });
}
#Txt_Date{
  width: 300px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.css">
<input id="Txt_Date">

<select id="numdays">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
</select>
...