在ExtJS中，如何在显示网格时加载商店？ [英] In ExtJS, how do I load a store when I display a grid?

问题描述

在ExtJS中，如何在显示网格时加载商店？我希望商店仅在网格显示时加载（用户点击按钮显示网格，所以预先加载商店是浪费的）。我尝试了 afterrender 监听器，但它将负载掩码渲染在错误的位置，而 afterlayout 监听器每次都重新加载网格网格调整大小。

解决方案

这是一个可能会有点痛苦的事情，因为给了浏览器太多可以立即执行（尤其在IE中）。

我喜欢使用延迟的组合，让浏览器恢复足够长的时间来正确渲染东西。 / p>

  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 
} 
}）; 
  

玩延迟/延迟的价值应该给你所需的结果。您需要延迟/延迟的时间长短取决于网格的复杂程度以及浏览器的速度。

还要记住，当您的商店的负载已经完成。

 监听器：{
 load：function（）{
 yourGrid.body.unmask （）; 
} 
} 
  

注意：对劳埃德答复的几点澄清 - 您不需要将autoLoad设置为false，因为这是默认值（即：根本不设置它），并且听起来像您的描述中要使用Stores load方法，而不是重新加载。 / p>

In ExtJS, how do I load a store when I display a grid? I want the store to load only when the grid is displayed (the user clicks on a button to show the grid, so it's wasteful to load the store beforehand). I tried the afterrender listener but it renders the loadmask in the wrong location, and the afterlayout listener reloads the grid every time the grid is resized.

解决方案

This is one of those things that can be a bit of a pain to accomplish because were giving the browser too much to do at once (particularly noticeable in IE).

I like to use a combination of defer to let the browser recover long enough to render things properly.

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
    }
});

Playing with the value of delay/defer should give you the desired results. The length of time you will need to delay/defer is dependent upon how complex your Grid is and how fast the browser is.

Also remember to remove the mask when your Store's load has completed.

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

NOTE: Just a few clarifications to the answer by Lloyd - you do not need to set autoLoad to false, because that is the default (ie: don't set it at all) and it sounds like from your description that you would want to use the Stores load method, instead of reload.

这篇关于在ExtJS中，如何在显示网格时加载商店？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！