jQuery календарь с настраиваемыми диапазонами дат - PullRequest
Новая
       22

jQuery календарь с настраиваемыми диапазонами дат

0 голосов
/ 10 марта 2012

У меня был поиск, и некоторые ответы попадают в мою проблему, но не достаточно близко.

Я собираю систему бронирования и имею ряд «тарифов» в базе данных MySQL.

Все эти тарифы имеют диапазон дат (и другие значения, такие как цена за ночь и т. Д., Которые не имеют отношения к данной конкретной проблеме).

Используя jQuery.datePicker, я хотел бы знать, есть ли способ разрешить выбор только дат в диапазоне дат из базы данных MySQL, и любые даты, которые не включены в эти диапазоны, отбрасываются / неактивна.

Таблица «Тариф» раскладывается следующим образом: 

id        date_from        date_to        color       price       min
1         2012/02/01       2012/03/15     red         10          2
2         2012/03/16       2013/04/10     green       7           0
2         2012/05/16       2013/06/10     green       7           0

Таким образом, единственные даты, которые должны быть выбраны, - это период с 1 февраля 2012 года по 10 апреля 2012 года и с 16 мая 2012 года по 10 июня 2012 года, а остальные даты не учитываются. Цвет, цена и минимальное значение не имеют отношения к этой проблеме.

Любая помощь или указание в правильном направлении будет высоко ценится!

EDIT:

После дальнейших поисков я оказался в ладонях, когда нашел решение здесь. Для всех, кто сталкивается с моим вопросом и нуждается в решении, перейдите сюда:

jQuery UI: несколько диапазонов для выбора даты?

Спасибо тем, кто ответил!

1 Ответ

1 голос
/ 10 марта 2012

В датчике jQuery есть параметры "minDate" и "maxDate". 

$(selector).datepicker({
    'minDate': new Date(2012, 2, 1),
    'maxDate': new Date(2012, 3, 15)
});

или в вашем php-файле: 

<script type="text/javascript">
$(function(){
    $("#date").datepicker({
        'dateFormat': 'm/d/yy',
        'minDate': new Date(<?php echo $minDate->format('Y, m, d'); ?>),
        'maxDate': new Date(<?php echo $maxDate->format('Y, m, d'); ?>)
    });
});
</script>
...