PDA

View Full Version : Ext JS TreePanel: Any way to update only portions that changed not the entire tree



palash
16 Oct 2009, 3:10 PM
Hi
I am currently creating a TreePanel with JSON data supplied from a Java Servlet like the following:
var treePanel = new Ext.tree.TreePanel({
id: 'tree-panel',
region:'center',
margins: '2 2 0 2',
autoScroll: true,
rootVisible: false,
singleExpand: true,
loader: new Ext.tree.TreeLoader({
method: 'Get',
dataUrl:'../servletName?' + query
}),

root: new Ext.tree.AsyncTreeNode()

});
treePanel.expandAll();
When I need to update the tree, I send a AJAX request with "data" from the tree( the whole tree) using JSON like following:
var data = Ext.util.JSON.encode(jsonData);//Here I create the jsonData that has data //about all the nodes of the tree

Ext.Ajax.request({
url: '../servletName?a=t-s',
method: 'POST',
params: {jsondata: data},
success: function ( result, request ) {
savesuccess();
},
failure: function ( result, request ) {
savefailed(result.responseText);
}
});
From the hierarchical JSON data , I recreate the object graph in Java and try to persist in database.
Problem is as long as the tree is relatively small with less nodes its fine, what if the tree grows big with too many nodes. Then I am ending up saving the whole data just because I am changing a single node.
Any idea how to only save( update) the node which is changed , without touching the nodes that remain unchanged.