定期更新EXTJS 4 Treepanel

时间:2011-04-20 08:57:37

标签: extjs refresh treepanel extjs4

我想创建一个Treepanel,每秒更新一次。 所以我带了一个带有代理的商店进行数据采集:

store = new Ext.data.TreeStore({
    model: 'TaskState',
        proxy: {
        type: 'ajax',
        url : '/getTaskList'
},
    root: {
        expanded: true
}});

商店似乎有用,数据显示在我的TreePanel

我尝试使用此功能更新Treepanel

function refresh(){
        store.load();
        window.setTimeout("refresh()", 1000);
    }

更新似乎也有效。不幸的是,更新会在每次更新时产生某种“闪烁”效果,因为整个树都会被重新加载。我正在寻找一种只刷新已经改变的节点的方法。

有没有办法做到这一点?

问候

4 个答案:

答案 0 :(得分:2)

有一种方法: 您可以将节点加载到某个临时存储,并按节点

更改主树的存储节点

答案 1 :(得分:2)

如果您想添加任何新节点并且不想重新加载整个商店,那么您可以像这样添加

 //overModel is Ext.data.Model
 overModel.appendChild({
                        id: responseJson.data['id'],
                        text:responseJson.data['text'],
                        children:responseJson.data['children'],//array of childern
                        parent_id:responseJson.data['parent_id']

  });
  overModel.expand();

如果你想加载整个商店,你可以做这样的事情

Ext.data.StoreManager.lookup('StoreName').load({ params: {"p1": p1}});

加载商店。 要定期更新商店,您可以使用DelatedTask类。

查看EXTJS的Documentation API将为您提供更多详细信息。

答案 2 :(得分:1)

存储是绑定Treepanel,如网格和存储,因此您可以使用

从树面板获取存储
var store=treepanel.getStore()

您可以使用

更新需要更新的分支来重新加载商店
store.load({node:selectedNode})

答案 3 :(得分:0)

您可以使用TaskManager

Ext.TaskManager.start({
    run: reloadStoreFunction,
    interval: 1000
});

这将每秒执行reloadStoreFunction。