Добавление прослушивателя событий на кнопку «Сегодня» в jquery-ui datapicker - PullRequest
Новая
       4

Добавление прослушивателя событий на кнопку «Сегодня» в jquery-ui datapicker

3 голосов
/ 05 января 2012

Я использую форму выбора даты jQuery-ui-1.8.16.

У меня есть следующий код: 

Site.Calendar = function() {

    // Set default setting for all calendars
    jQuery.datepicker.setDefaults({
        showOn : 'both',
        buttonImageOnly : true,
        buttonText: '',
        changeMonth : true,
        changeYear : true,
        showOtherMonths : true,
        selectOtherMonths : true,
        showButtonPanel : true,
        dateFormat : "D, d M, yy",
        showAnim : "slideDown",
        onSelect: Site.Calendar.customiseTodayButton
    });
};

Site.Calendar.customiseTodayButton = function(dateText, inst) {
    console.log("hello");
};

Моя функция customiseTodayButton срабатывает только при выборефактическая дата, а НЕ кнопка «Сегодня».

Есть ли способ переопределить работу кнопки «сегодня» в средстве выбора даты jQuery?

Спасибо

Ответы [ 3 ]

6 голосов
/ 05 января 2012

Нет стандартного события для нажатия кнопки «Сегодня».Однако, взглянув на код jquery.ui.datepicker.js, выясняется, что он вызывает $.datepicker._gotoToday.Я предполагаю, что к customizeTodayButton вы пытаетесь изменить поведение того, что он делает в настоящее время (не внешний вид, внешний вид будет сделан со стилем)Чтобы изменить существующее поведение, хорошо знать, что он делает сейчас.Итак, помните, что это текущий код используемой функции: 

/* Action for current link. */
_gotoToday: function(id) {
    var target = $(id);
    var inst = this._getInst(target[0]);
    if (this._get(inst, 'gotoCurrent') && inst.currentDay) {
        inst.selectedDay = inst.currentDay;
        inst.drawMonth = inst.selectedMonth = inst.currentMonth;
        inst.drawYear = inst.selectedYear = inst.currentYear;
    }
    else {
        var date = new Date();
        inst.selectedDay = date.getDate();
        inst.drawMonth = inst.selectedMonth = date.getMonth();
        inst.drawYear = inst.selectedYear = date.getFullYear();
    }
    this._notifyChange(inst);
    this._adjustDate(target);
},

Чтобы переопределить эту функцию своей собственной функциональностью, вам нужно обновить код до чего-то вроде этого: 

Site.Calendar = function() {
    //override the existing _goToToday functionality
    $.datepicker._gotoTodayOriginal = $.datepicker._gotoToday;
    $.datepicker._gotoToday = function(id) {
        // now, call the original handler
        $.datepicker._gotoTodayOriginal.apply(this, [id]);
        // invoke selectDate to select the current date and close datepicker.
        $.datepicker._selectDate.apply(this, [id]);
    };

    // Set default setting for all calendars
    jQuery.datepicker.setDefaults({
        showOn: 'both',
        buttonImageOnly: true,
        buttonText: '',
        changeMonth: true,
        changeYear: true,
        showOtherMonths: true,
        selectOtherMonths: true,
        showButtonPanel: true,
        dateFormat: "D, d M, yy",
        showAnim: "slideDown"
    });
};

Также, вот рабочая jsFiddle того, что вы ищете.

4 голосов
/ 06 января 2012

Я нашел здесь следующее: Кнопка Today в jQuery Datepicker не работает 

jQuery.datepicker._gotoToday = function(id) {
        var target = jQuery(id);
        var inst = this._getInst(target[0]);
        if (this._get(inst, 'gotoCurrent') && inst.currentDay) {
                inst.selectedDay = inst.currentDay;
                inst.drawMonth = inst.selectedMonth = inst.currentMonth;
                inst.drawYear = inst.selectedYear = inst.currentYear;
        }
        else {
                var date = new Date();
                inst.selectedDay = date.getDate();
                inst.drawMonth = inst.selectedMonth = date.getMonth();
                inst.drawYear = inst.selectedYear = date.getFullYear();
                this._setDateDatepicker(target, date);
                this._selectDate(id, this._getDateDatepicker(target));
        }
        this._notifyChange(inst);
        this._adjustDate(target);
    }

Она просто переписывает метод goToToday и добавляет две новые строки: 

this._setDateDatepicker(target, date);
this._selectDate(id, this._getDateDatepicker(target));

Может быть, есть более чистый способ исправить это с помощью вашего оригинального ответа Марк?

3 голосов
/ 02 мая 2012

Я понял переопределение кнопки сегодня следующим образом: 

jQuery.datepicker._gotoToday = function(id) {
    var today = new Date();
    var dateRef = jQuery("<td><a>" + today.getDate() + "</a></td>");
    this._selectDay(id, today.getMonth(), today.getFullYear(), dateRef);
};

Это довольно просто и выполняет функции "выбрать дату и закрыть указатель даты", как и я.

...