[英]In ExtJS, how do I load a store when I display a grid?
In ExtJS, how do I load a store when I display a grid? 在ExtJS中,如何在显示网格时加载商店? 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. 我尝试了
afterrender
监听器,但它将loadmask呈现在错误的位置,并且每次调整网格大小时, afterlayout
监听器会重新加载网格。
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). 这是可能有点痛苦的事情之一,因为一次给浏览器太多了(在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.
延迟/延迟所需的时间长度取决于Grid的复杂程度和浏览器的速度。
Also remember to remove the mask when your Store's load has completed. 还要记住在Store的加载完成后删除掩码。
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. 注意:Lloyd对答案的一些澄清 - 您不需要将autoLoad设置为false,因为这是默认设置(即:根本不设置它)并且听起来像您的描述中您想要的使用Stores加载方法,而不是重新加载。
Have you considered handling activate
event? 你考虑过处理
activate
事件吗? You can add an event handler that loads data on activate
event and then removes itself. 您可以添加一个事件处理程序,用于在
activate
事件上加载数据,然后自行删除。
this.on('activate', function(){
this.un('activate', arguments.callee);
this.store.load();
}, this);
Here this
refers to GridPanel
. 这里
this
指GridPanel
。
You can set autoLoad to false for the store and just call store.reload(); 您可以为商店将autoLoad设置为false,只需调用store.reload(); when the user clicks on the button to show the grid.
当用户点击按钮显示网格时。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.