JQuery, ограничивающий диапазон дат на основе раскрывающегося списка

Я использую JQuery DatePicker, чтобы пользователь выбрал дату и отобразил ее в текстовом поле. Достаточно легко. Однако ограничение, над которым я работаю, заключается в том, что диапазон дат ограничен в зависимости от месяца, который в настоящее время выбран в раскрывающемся меню пользователя, до дат начала и окончания месяца.

Так, например, если кто-то выбирает «Авг/2010» в раскрывающемся списке, то Datepicker для текстового поля должен быть между 1 августа и 31 августа — началом и концом месяца. Этот

Текстовое поле выводит HTML:

<select id="ctl00_contentlocalnav_Menu_selectmonth">
    <option value="NA">-- Select Month --</option>
    <option value="Jun/2010">Jun/2010</option>
    <option selected="selected" value="May/2010">May/2010</option>
    <option value="Aug/2009">Aug/2009</option>
    <option value="Jul/2009">Jul/2009</option>
</select>

JQuery:

     jQuery(document).ready(function() {
         $("#ctl00_contentactual_txtDate").datepicker({ minDate: new Date(2010, 8 - 1, 1), maxDate: new Date(2010, 8 - 1, 31) });
     });

Как видите, диапазон JQuery жестко запрограммирован. Каков наилучший способ решить эту проблему?


person firedrawndagger    schedule 11.08.2010    source источник
comment
Из любопытства, почему вы не разрешаете выбирать год и месяц с помощью средства выбора даты? Если это для удобства (большой диапазон лет), то зачем ограничивать пользователя?   -  person Jamie Wong    schedule 11.08.2010
comment
это хороший вопрос - в основном это неуместно, потому что именно так я получаю данные из базы данных.   -  person firedrawndagger    schedule 11.08.2010
comment
Не могли бы вы уточнить, почему пользователь ограничен определенными парами месяца и года? Если вам нужны месяц и год для получения данных из базы данных, не могли бы вы просто получить месяц и год из выбранной даты и посмотреть оттуда в базу данных?   -  person Nate Pinchot    schedule 11.08.2010
comment
@ Нейт не уверен, что понял вопрос. Мне нужны пары «Месяц/Год», чтобы вернуть данные в базу данных, так что это шаг 1. Следующий шаг заключается в том, что пользователь может захотеть изменить определенные даты в выводимых данных, но он ограничен этим конкретным месяцем/годом.   -  person firedrawndagger    schedule 11.08.2010


Ответы (1)


Вот что я бы сделал.

Измените значения в раскрывающемся списке, чтобы они содержали минимальный и максимальный диапазон дат, который может быть проанализирован JavaScript. Например:

<select id="ctl00_contentlocalnav_Menu_selectmonth">
    <option value="NA">-- Select Month --</option>
    <option value="06/01/2010-06/30/2010">Jun/2010</option>
    <option selected="selected" value="05/01/2010-05/31/2010">May/2010</option>
    <option value="08/01/2009-08/31/2009">Aug/2009</option>
    <option value="07/01/2009-07/31/2009">Jul/2009</option>
</select>

Затем вы можете привязаться к событию change раскрывающегося списка и изменить диапазон выбора даты.

$(function() {
    $('#ctl00_contentlocalnav_Menu_selectmonth').change(function() {
        var ranges = $(this).val().split('-');
        var minDate = new Date();
        minDate.setTime(Date.parse(ranges[0]));
        var maxDate = new Date();
        maxDate.setTime(Date.parse(ranges[1]));
        $("#ctl00_contentactual_txtDate").datepicker('option', 'minDate', minDate);
        $("#ctl00_contentactual_txtDate").datepicker('option', 'maxDate', maxDate);
    });
});​
person Nate Pinchot    schedule 11.08.2010
comment
Это хорошо, но я не могу изменить значение, поскольку на самом деле это раскрывающийся список ASP. - person firedrawndagger; 12.08.2010
comment
Это возможно. Я сделал это в прошлом. Если вы предоставите пример кода, я могу попытаться вам помочь. - person Nate Pinchot; 12.08.2010