我有一个网格面板(商店和模型与之关联),其中我以行方式显示所有数据。网格面板列包含操作列,如果人员单击,则在选项卡中打开一个新表单样式和用户填充数据并将其保存在db中。我想要的是,每隔几秒钟应该如何刷新商店,以便这些数据也应该自动显示在网格面板中。我该怎么办?
答案 0 :(得分:0)
您可以通过多种方式处理此问题,我个人只是在表单关闭后重新加载商店,重新加载任何更新而不是仅仅重新加载。
下面的代码显示了如何在ExtJs中使用TaskRunner每隔x秒重新加载一次商店。您还可以在商店的load事件中添加一个setTimeout,这样每次商店加载时都会安排它在x秒内再次加载。
Ext.application({
name: 'Fiddle',
launch: function() {
var store = Ext.create('Ext.data.JsonStore', {
storeId: 'simpsonsStore',
fields: ['name', 'email', 'phone'],
autoLoad: true,
proxy: {
type: 'ajax',
url: 'data1.json',
reader: {
type: 'json',
rootProperty: 'characters'
}
},
listeners: {
load: function() {
console.log(this);
}
}
});
Ext.create('Ext.grid.Panel', {
title: 'Simpsons',
store: store,
columns: [{
text: 'Name',
dataIndex: 'name'
}, {
text: 'Email',
dataIndex: 'email',
flex: 1
}, {
text: 'Phone',
dataIndex: 'phone'
}],
height: 200,
width: 400,
renderTo: Ext.getBody()
});
var runner = new Ext.util.TaskRunner(),
task = runner.start({
run: function() {
store.reload();
},
interval: 3000
});
// IMPORTANT: Dont forget to call stop at a logical point.
runner.stop();
}
});
还有一个fiddle包含您可以使用的代码。
如果我必须使用SetTimeout或TaskRunner选项,我可能会在父面板/容器的render事件中初始化它们,并侦听beforeDestroy事件以阻止它们运行。