Как мне сохранить / скрыть / показать / переместить / изменить размер столбца таблицы данных ExtJS?

Question

Я бы хотел, чтобы изменения в столбце таблицы данных ExtJS (скрытие, отображение, перемещение, изменение размера) сохранялись и сохранялись на сервере.Есть много событий для прослушивания, но регистрация обработчиков в самой сетке, по-видимому, не приводит к вызову оповещений:

    grid.on('hide', function(event)
        {
        alert('Save column order: column hidden.');
        });
    grid.on('move', function(event)
        {
        alert('Save column order: column moved.');
        });
    grid.on('resize', function(event)
        {
        alert('Save column sizes: column resized.');
        });
    grid.on('show', function(event)
        {
        alert('Save colum order: column shown.');
        });

(Мой базовый подход может быть или не быть оптимальным.)

Что конкретно я должен сделать, чтобы слушать эти события?Я могу скрывать, показывать, перемещать и изменять размер столбцов без предупреждения.

Answer 1

Сначала , вам необходимо настроить поставщика состояний . CookieProvider - единственный, который поставляется с ExtJS

Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

Второй , отметка yourGridPanel.stateful как true

Третий , посмотрите, нужно ли вам изменить значение по умолчанию для GridPanel . stateEvents Это в основном " Массив событий, который при запуске должен запускать этот компонент для сохранения его состояния "

Четвертый , HttpStateProvider не поставляется с ExtJSно Saki имеет ux (расширение пользователя) для него .

Пятый , если вы хотите сохранить состояния нескольких компонентов, они должны иметьлибо id, либо stateId явно задано.

Хороший подход будет состоять в том, чтобы заставить эту работу работать, как ожидается, со встроенным CookieProvider , а затем переключиться на Http Provider .

Answer 2

Сетка должна иметь свойство под названием «с состоянием». Установите для этого параметра значение True, и сетка должна помнить ширину столбцов и т. Д.

Answer 3

Сконфигурируйте сетку с помощью stateful: true и установите ее stateId (необязательно, если у вашей сетки есть идентификатор, который не изменится).Также инициализируйте Ext.state.Manager:

var thirtyDays = new Date(new Date().getTime()+(1000*60*60*24*30));
Ext.state.Manager.setProvider(new Ext.state.CookieProvider({expires: thirtyDays}));

Хотя он не включен в Ext 3, вы можете найти в сети поставщика состояний, который использует HTML5 localStorage вместо файлов cookie.