Updating EXTJS 4 Treepanel periodic

I would like to create a Treepanel, which is updated once a second. So I took a store with a proxy for data acquistion:

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

The store seems to work, the data is displayed in my TreePanel.

I tried to update the Treepanel with this function:

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

The update seems to work as well. Unfortunately the update causes some kind of "blinking" effekt on every update, because the whole tree is reloaded. I'm searching for a way to only refresh the nodes, which have changed.

Is开发者_开发技巧 there some way to do this?

greetings

There is one way: You can load your nodes to some temp store and change your main tree's store node by node

If you want to add any new node and do not want to reload the whole store then you can add like this

 //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();

and if you want to load the whole store the you can do something like this

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

to load the store. To update the store periodically you can use DelatedTask Class.

check out the Documentation API of EXTJS will give you more details.

Store is bind Treepanel like grid and store ,so you can get Store from tree panel with

var store=treepanel.getStore()

and you can reload the store with branch that you need update with

store.load({node:selectedNode})

You could use TaskManager for that:

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

This would execute reloadStoreFunction every second.