Фильтрация jqGrid DatePicker без нажатия клавиши Enter

Я создаю свое первое приложение ASP.NET MVC 3 и использую jqGrid. Один из моих столбцов, «Создано вкус», представляет собой столбец даты, и я хотел бы отфильтровать сетку в этом столбце с помощью DatePicker. Вот что происходит в настоящее время: пользователь щелкает поле фильтра заголовка столбца, отображается средство выбора даты, а затем пользователь выбирает год, месяц и щелкает день. Средство выбора уходит и оставляет дату, скажем, 28.03.2009, в текстовом поле. Чтобы на самом деле заставить фильтр работать, я должен щелкнуть это поле и нажать клавишу Enter, что немного раздражает пользователя.

Есть ли способ, чтобы фильтр автоматически срабатывал, когда пользователь щелкает в этот день?

(Кроме того, я не уверен, для чего используется кнопка "Готово", так как средство выбора исчезает каждый раз, когда я нажимаю в течение дня. Возможно, это настройка, которую я упускаю.)

Кто-нибудь еще нуждался в этой функции и решил ее?

Я пытался сделать что-то вроде этого:

dataInit: function (elem) {
  $(elem).datepicker({ changeYear: true, changeMonth: true, showButtonPanel: true,
    onSelect: function (dateText, inst) {
       $("#icecreamgrid")[0].trigger("reloadGrid");
    }
  })
}

как я видел, что кто-то на каком-то сайте предлагает, но это, похоже, не сработало.


jqgrid
person itsmatt    schedule 29.07.2011    source источник

Ответы (1)


arrow_upward
16
arrow_downward

Вы можете попробовать с

dataInit: function (elem) {
    $(elem).datepicker({
        changeYear: true,
        changeMonth: true,
        showButtonPanel: true,
        onSelect: function() {
            if (this.id.substr(0, 3) === "gs_") {
                // in case of searching toolbar
                setTimeout(function(){
                    myGrid[0].triggerToolbar();
                }, 50);
            } else {
                // refresh the filter in case of
                // searching dialog
                $(this).trigger("change");
            }
        }    
    });
}

ОБНОВЛЕНО: начиная с версии 4.3.3 jqGrid инициализирует DOM сетки как this из dataInit. Таким образом, в приведенном выше коде нет необходимости использовать переменную myGrid. Вместо этого можно использовать:

dataInit: function (elem) {
    var self = this; // save the reference to the grid
    $(elem).datepicker({
        changeYear: true,
        changeMonth: true,
        showButtonPanel: true,
        onSelect: function() {
            if (this.id.substr(0, 3) === "gs_") {
                // in case of searching toolbar
                setTimeout(function () {
                    self.triggerToolbar();
                }, 50);
            } else {
                // refresh the filter in case of
                // searching dialog
                $(this).trigger("change");
            }
        }    
    });
}

Бесплатные вызовы jqGrid со вторым параметром options для dataInit, который содержит дополнительную информацию, например свойство mode. Значение свойства mode равно "filter" в случае вызова внутри панели инструментов фильтра (и "search" в случае диалога поиска). Таким образом, можно использовать следующий код

dataInit: function (elem, options) {
    var self = this; // save the reference to the grid
    $(elem).datepicker({
        changeYear: true,
        changeMonth: true,
        showButtonPanel: true,
        onSelect: function() {
            if (options.mode === "filter") {
                // in case of searching toolbar
                setTimeout(function () {
                    self.triggerToolbar();
                }, 0);
            } else {
                // refresh the filter in case of
                // searching dialog
                $(this).trigger("change");
            }
        }    
    });
}
person Oleg    schedule 29.07.2011
comment
Это работает очень хорошо, Олег. Спасибо. Нажатие Esc вызывает GET, но я могу жить с этим - я не извлекаю столько данных. Я мог бы вызвать функцию, которая проверяет перед вызовом triggerToolbar(). - person itsmatt; 29.07.2011
comment
Возможно, вам лучше вызывать triggerToolbar внутри onSelect, а не внутри onClose? Вы можете точно описать, в какой ситуации вы хотите принудительно выполнять поиск на панели инструментов, а в какой нет. В общем случае onSelect — это событие, которое вызывается, если пользователь выбирает новую дату. - person Oleg; 29.07.2011
comment
@itsmatt: Добро пожаловать! Я изменил код из моего ответа, следуя другому прямо, на лучший способ. - person Oleg; 30.07.2011
comment
@itsmatt: я немного подумал о проблеме и попытался сделать демо. Теперь я думаю, что использование onSelect, как я описал здесь, не самое лучшее в случае использования как расширенного поиска, так и панели инструментов фильтра. На выходных изучу проблему более точно и позже выложу больше информации. - person Oleg; 30.07.2011
comment
@itsmatt: я изменил ответ еще раз. Теперь это работает в случае обоих видов поиска. - person Oleg; 30.07.2011
comment
У меня была такая же проблема при нажатии клавиши ввода при выборе даты, теперь она решена. Спасибо за ценное решение. - person Siddiqui; 05.08.2011
comment
@Фархан Сиддики: Добро пожаловать! Кстати, если бы вы больше голосовали за ответы, которые были полезны для вас, другим людям было бы лучше их найти. Поисковик использует счетчик голосов в качестве основного критерия порядка результатов поиска. - person Oleg; 05.08.2011