Есть ui datepicker в котором можно выбрать (available) либо конкретные даты, либо период между 2-мя датами, значение которых берется из data-attr.
var availableDates = ["20-2-2017","23-2-2017","25-2-2017"]; массив дат
function available(date) {
dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
if ($.inArray(dmy, availableDates) != -1) {
return [true, "","Available"];
} else {
return [false,"","unAvailable"];
}
}
$.each($('.js-ui-datepicker'), function() {
var mindate = $(this).attr('data-minDate');
var maxdate = $(this).attr('data-maxDate');
$(this).datepicker({
beforeShow: function(input, inst)
{
inst.dpDiv.css({marginTop: 10 + 'px'});
},
beforeShowDay: available, //делаем доступными конкретные даты
dateFormat: "dd-mm-yy",
yearRange: "-100:+100",
changeYear: false,
minDate: new Date(mindate), //устанавливаем минимальную дату из значения атрибута
maxDate: new Date(maxdate)//устанавливаем максимальную дату из значения атрибута
});
});
Так выглядит HTML
<input type="text" placeholder="" value="20-02-2017" data-minDate="02/20/2017" data-maxDate="03/06/2017" name="start-date" class="js-ui-datepicker">
Необходимо при при указании атрибутов минимальной и максимальной дат, делать доступными период, в ином случае, только конкретные даты.
Заранее спасибо!