@0348raven

Как сделать кастомный выбор в ui datepicker?

Есть 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">


Необходимо при при указании атрибутов минимальной и максимальной дат, делать доступными период, в ином случае, только конкретные даты.
Заранее спасибо!
  • Вопрос задан
  • 214 просмотров
Пригласить эксперта
Ответы на вопрос 1
@2bereal
$( "#datepicker1" ).datepicker({
dateFormat: "yy-mm-dd",
onSelect: function(dateStr) {
	   $('#datepicker2').datepicker('option', 'minDate', dateStr || '2013-09-10');
 },
});
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы