Как в ExtJS загрузить магазин при отображении сетки?

Question

Как в ExtJS загрузить магазин при отображении сетки? Я хочу, чтобы магазин загружался только при отображении сетки (пользователь нажимает на кнопку, чтобы показать сетку, поэтому загружать магазин заранее не стоит). Я попробовал прослушиватель afterrender, но он отображает маску загрузки в неправильном месте, и прослушиватель afterlayout перезагружает сетку каждый раз, когда сетка изменяется.

Answer 1

Это одна из тех вещей, которые могут быть немного трудны для выполнения, потому что давали браузеру слишком много, чтобы делать сразу (особенно заметно в IE).

Мне нравится использовать комбинацию defer, чтобы позволить браузеру восстанавливаться достаточно долго для правильной визуализации.

var grid = new Ext.grid.GridPanel({
    ...,
    listeners : {
       render : function(grid){      
           grid.body.mask('Loading...');
           var store = grid.getStore();
           store.load.defer(100, store);
       },
       delay: 200
    }
});

Игра со значением задержки / отсрочки должна дать вам желаемые результаты. Время, которое вам нужно будет отложить / отложить, зависит от того, насколько сложна ваша таблица и насколько быстро работает браузер.

Также не забудьте удалить маску, когда загрузка вашего Магазина будет завершена.

listeners: {
    load: function(){
        yourGrid.body.unmask();
    }
}

ПРИМЕЧАНИЕ. Всего несколько пояснений к ответу Ллойда - вам не нужно устанавливать autoLoad в false, потому что это значение по умолчанию (т. Е. Вообще не устанавливайте его), и в вашем описании это звучит как захочет использовать метод загрузки Stores вместо перезагрузки.

Answer 2

Рассматривали ли вы обработку события activate? Вы можете добавить обработчик событий, который загружает данные в событие activate, а затем удаляет себя.

this.on('activate', function(){
 this.un('activate', arguments.callee);
    this.store.load();
}, this);

Здесь this относится к GridPanel.

Answer 3

Вы можете установить для autoLoad значение false для магазина и просто вызвать store.reload (); когда пользователь нажимает на кнопку, чтобы показать сетку.