Как использовать более одного типа gridfilter в ExtJS? - PullRequest
Новая
       19

Как использовать более одного типа gridfilter в ExtJS?

1 голос
/ 07 июня 2019

В настоящее время я работаю со значениями временной метки SQL (дата + время) в моих столбцах на панели сетки.Чтобы отфильтровать это правильно, мне нужно меню даты и времени в заголовке столбца.Комбинация типов 'date' и 'number' была бы достаточной.

Другими словами, мне нужно меню заголовка столбца, в котором есть меню фильтра даты и чисел.Как мне удается применить два типа фильтров к меню заголовка столбца?Если это не работает напрямую, как создать собственный фильтр, который объединяет типы даты и числа?

Тип числа:

enter image description here

Тип даты: enter image description here

РЕДАКТИРОВАТЬ: С помощью @abeyaz мне удалось создать специальный фильтр столбцов с полями чисел и дат.Хотя я не смог найти способ внести изменения в значения в полях, применимые к удаленному фильтру магазина.Как следует настроить события, вызываемые при нажатии пользователем клавиши ввода в числовом поле, например, для изменения массива фильтра хранилища?

enter image description here

1 Ответ

2 голосов
/ 09 июня 2019

Нет встроенного сеточного фильтра даты и времени.Однако вы можете легко реализовать это самостоятельно.Сначала проверьте код фильтра даты.Вы должны создать класс Ext.grid.filters.menu.DateTime, расширяющий Ext.grid.filters.menu.Base, как в классе даты.Что вы можете сделать, это;вместо использования datefield в items, вы должны использовать контейнер поля, который включает в себя datefield и timefield вместе.Следующий пример даст вам представление: 

   menu: {
        items: {
            lt: {
                xtype: 'fieldcontainer',
                label: 'Before',
                placeholder: 'Before...',
                operator: '<',
                weight: 10,
                items: [
                    {
                        xtype: 'datefield', 
                        flex: 1,
                        listeners: {
                            change: 'up.onInputChange'
                        }
                    },
                    {
                        xtype: 'timefield', 
                        width: 80,
                        listeners: {
                            change: 'up.onInputChange'
                        }
                    }
                ]
            }
        }
    }

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

...