Несколько дат в Bootstrap date-picker

Я пытаюсь выбрать несколько дат в Boostrap-Datepicker.

Я intialized datepicker как таковой, просто отлично.

$('#datepicker2').datepicker();

Теперь я хочу выбрать несколько дат на календаре:

$('#datepicker2').datepicker('setDate', [new Date(2014, 2, 5),new Date(2014, 3, 5)]);

Это не работает. Ошибки не регистрируются, но даты не выбраны.


EDIT: версия datepicker, которую я использовал, имела некоторые проблемы с multidates, я использовал предыдущую версию и это работает-вероятно, проблема версии


это работает просто отлично, хотя:

$('#datepicker2').datepicker('setDate', new Date(2014, 2, 5));

2 ответов


надо сначала определить свой элемент управления datepicker как комплектовщик multidate через параметры.

$('#datepicker2').datepicker({
  multidate: true
});

затем вы можете установить свои даты через setDates способ :

$('.date').datepicker({
    multidate: true
});

$('.date').datepicker('setDates', [new Date(2014, 2, 5), new Date(2014, 3, 5)])
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker.css" rel="stylesheet"/>
<input type="text" class="form-control date"/>

вы также можете установить предел для количества дат, которые будут выбраны. Ниже пример, вы сможете выбрать только 5 дат максимум.

пример

$("#Txt_Date").datepicker({
    format: 'd-M-yyyy',
    inline: false,
    lang: 'en',
    step: 5,
    multidate: 5,
    closeOnDateSelect: true
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/js/bootstrap-datepicker.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker.css" rel="stylesheet"/>


<input type="text" id="Txt_Date" placeholder="Choose Date" style="cursor: pointer;">