Показывать месяцы вне диапазона дат в селекторе? - PullRequest
Новая
       6

Показывать месяцы вне диапазона дат в селекторе?

1 голос
/ 08 сентября 2011

Я использую jQuery UI DatePicker , чтобы выбрать дату рождения для потребителей на моем веб-сайте.В настоящее время он отображается с выпадающими выпадающими месяцами и годами. Когда, например, я ограничиваю годы значениями -18y, с помощью maxDate, выпадающий месяц не отображает все месяцы, когда выбран год 1993.Он показывает только месяцы до максимальных месяцев.

При тестировании юзабилити мы обнаружили, что наша демографическая группа имеет тенденцию нажимать на месяц их рождения, затем год, а затем день.

Есть ли способ показать все месяцы, даже если даты в этом месяце недоступны для выбора?

Вот код, используемый для отображения DatePicker: 

$('.DobWidget').datepicker({
    showOn: 'both',        
    buttonImage: '/media/img/admin/icon_calendar.gif',
    buttonImageOnly: true, 
    dateFormat: js_date_format, // mm/dd/yyyy  
    constrainInput: false, // Handled server-side for type-in.
    changeMonth: true,
    changeYear: true,
    maxDate: '-18y',
    minDate: '-110y',
    showButtonPanel: true,
    onChangeMonthYear: function(year, month, inst) {
        if (inst.currentDay != 0) {     
            $(this).datepicker("setDate", new Date(year, month - 1, inst.currentDay));
        }                  
    }
});

В настоящее время я использую jQueryUI v.1.8.16 и jQuery v.1.6.3, предоставленные API Google AJAX.

1 Ответ

0 голосов
/ 09 февраля 2012

Исправление для jquery ui 1.8.17 У меня также была эта проблема, с которой я начал работать, изменив некоторые вещи в коде jquery. Теперь я вижу все месяцы и могу выбирать их, но даты по-прежнему будут недоступны для выбора, как вы хотите.

В функции _generateHTML в операторе if вы добавляете maxDraw.setMonth ('11 '): 

if (maxDate) {
            maxDraw = (minDate && maxDraw < minDate ? minDate : maxDraw);
            maxDraw.setMonth('11');
            while (this._daylightSavingAdjust(new Date(drawYear, drawMonth, 1)) > maxDraw) {
                ...
            }
        }

В функции _generateMonthYearHeader в цикле for оператора else, который вы изменяете: 

for (var month = 0; month < 12; month++) {
                if ((!inMinYear || month >= minDate.getMonth()) &&
                        (!inMaxYear || month <= maxDate.getMonth()))
                    monthHtml += '<option value="' + month + '"' +
                        (month == drawMonth ? ' selected="selected"' : '') +
                        '>' + monthNamesShort[month] + '</option>';
            }

становится 

for (var month = 0; month < 12; month++) {
                if ((!inMinYear || month >= minDate.getMonth()) &&
                        (!inMaxYear || month <= 11))
                    monthHtml += '<option value="' + month + '"' +
                        (month == drawMonth ? ' selected="selected"' : '') +
                        '>' + monthNamesShort[month] + '</option>';
            }

В _restrictMinMax вы добавляете maxDate.setMonth ('11 '): 

...
var maxDate = this._getMinMaxDate(inst, 'max');
        maxDate.setMonth('11');
        var newDate = (minDate && date < minDate ? minDate : date);
...

В _isInRange вы добавляете maxDate.setMonth ('11 '): 

var minDate = this._getMinMaxDate(inst, 'min');
        var maxDate = this._getMinMaxDate(inst, 'max');
        maxDate.setMonth('11');
...
...