JQuery UI Datepicker медленно во время ввода - PullRequest
4 голосов
/ 15 июля 2010

Я слышал все эти замечательные впечатления о том, насколько великолепен и элегантен jQuery, но я 0 на 2 пытаюсь реализовать элементы управления jQuery в реальных проектах из-за низкой производительности. В этот раз я столкнулся с проблемой, подобной Ричарду . JQuery UI DatePicker не прошел тестирование приемлемости пользователя в приложении ASP.NET, над которым я работаю, потому что при вводе текста в текстовом поле есть определенные задержки, особенно при вводе последних двух чисел. (например, «1/1/20 10 »).

Кто-нибудь знает вариант / подход, который бы препятствовал тому, чтобы пользовательский интерфейс jQuery мешал пользователю печатать в текстовом поле, к которому он привязан?

Ответы [ 2 ]

3 голосов
/ 12 апреля 2011

Чтобы расширить сказанное Джейсоном, вы можете переопределить метод вне базового файла пользовательского интерфейса, выполнив это

jQuery(function(){
  jQuery.datepicker._doKeyUp = function(event) {
    var inst = jQuery.datepicker._getInst(event.target);
    if(jQuery.datepicker._datepickerShowing) {
        if(inst.input.val() != inst.lastVal) {
            try {
                var date = jQuery.datepicker.parseDate(jQuery.datepicker._get(inst, 'dateFormat'),
                                                       (inst.input ? inst.input.val() : null),
                                                       jQuery.datepicker._getFormatConfig(inst));
                if(date) { // only if valid
                    jQuery.datepicker._setDateFromField(inst);
                    jQuery.datepicker._updateAlternate(inst);
                    jQuery.datepicker._updateDatepicker(inst);
                }
            }
            catch (event) {
                jQuery.datepicker.log(event);
            }
        }
     }
      return true;
    }
 }); 

.......

3 голосов
/ 23 марта 2011

У меня была такая же проблема в IE 6. Я использовал инструмент повышения производительности (DynaTrace Ajax Edition), чтобы увидеть, где была задержка, и я нашел его в функции даты обновления, выполняемой для события keyup. Итак, моя работа заключалась в том, чтобы деактивировать событие keyup.

$( "#idOfTheInput" ).unbind("keyup");

РЕДАКТИРОВАТЬ: Есть недостаток сделать это. При вводе даты вручную, средство выбора даты не обновляется.

Итак, еще одно (лучшее?) Решение состоит в том, чтобы отображать средство выбора даты только тогда, когда пользователь нажимает на маленькую кнопку с параметром showOn: 'button' (подробнее здесь: http://jqueryui.com/demos/datepicker/#icon-trigger)

Затем измените код средства выбора даты JQuery, чтобы обновлять дату только тогда, когда отображается средство выбора даты. Для этого найдите функцию _doKeyUp и добавьте условие, гласящее: «Если отображается средство выбора даты, выполните обновление, в противном случае не обновляйте».

_doKeyUp: function(event) {
    var inst = $.datepicker._getInst(event.target);
    if ($.datepicker._datepickerShowing) {
        if (inst.input.val() != inst.lastVal) {
            try {
                var date = $.datepicker.parseDate($.datepicker._get(inst, 'dateFormat'),
                    (inst.input ? inst.input.val() : null),
                    $.datepicker._getFormatConfig(inst));
                if (date) { // only if valid
                    $.datepicker._setDateFromField(inst);
                    $.datepicker._updateAlternate(inst);
                    $.datepicker._updateDatepicker(inst);
                }
            }
            catch (event) {
                $.datepicker.log(event);
            }
        }
    }
    return true;
},

Конечно, немного неприятно менять код плагина ...

...