PDA

View Full Version : Extjs Tree Store auto sync with server



charles.bourasseau
11 Apr 2012, 7:30 AM
Hi,

how to use store to sync with server when using a Tree ?

I tried to use TreeStore (http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.TreeStore) but it does not have any appendChild oder addChild.
NodeInterface (http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.NodeInterface) has a appendChild method but it does not sync with the server trough the store or proxy...

Any ideas ?

vietits
11 Apr 2012, 3:13 PM
1. You add records into TreeStore through its nodes. The following example shows how to add a node into root node.


treestore.getRootNode().appendChild({text: 'node', leaf: true....});


2. To sync TreeStore to with server, you use treestore.sync() or set its autoSync to true to automatically sync.

charles.bourasseau
12 Apr 2012, 6:23 AM
It works actually very well.

I just have a problem because the autoSync does not work even though it's set to true...



var store = Ext.getStore('MyStore');
store.getNodeById(id).remove(); // No Ajax here
store.sync(); // Ajax..


I also tried destroy(), but it produces an error and I can't figure out which line produces it:


TypeError: Cannot call method 'indexOf' of undefined

vietits
12 Apr 2012, 6:39 AM
Below is my fix in removing a node.


var store = Ext.getStore('MyStore');
// store.getNodeById(id).remove(); // No Ajax here
var node = store.getNodeById(id);
node.parentNode.removeChild(node);
store.sync(); // Ajax..

charles.bourasseau
12 Apr 2012, 6:47 AM
I works, but it's not autoSync :(

I would like to have autoSync

vietits
12 Apr 2012, 3:56 PM
Which version do you use? TreeStore.autoSync has effect only from Ext 4.1.

charles.bourasseau
12 Apr 2012, 11:27 PM
Hi, I used 4.0.7. I just try 4.1 and it works well.

I'm using a Rest Proxy, but I think it's not 100% rest.

The GET Request looks like Ajax one, it has Query String parameter, I thought the node would be in the url and not as Query. And for POST I would expect something like:
http://<url>/<Parent Resource ID> but it's only http://<url>.

Here are the POST, GET, DELETE Request:


"method": "POST", "url": "http://localhost:3000/fs2http?_dc=1334301544571",
"httpVersion": "HTTP/1.1",
"queryString": [
{
"name": "_dc",
"value": "1334301544571"
}
],
"postData": {
"mimeType": "application/json",
"text": "{

"id":"",
"type":"dir",
"status":"",
"text":"test2",
"parentId":"4f86955df24634440f000014/home/ec2-user",
"leaf":false
}"
}




"method": "DELETE",
"url": "http://localhost:3000/fs2http/4f86955df24634440f000014/home/ec2-user/test?_dc=1334301534009",
"queryString": [
{
"name": "_dc",
"value": "1334301534009"
}
],
"postData": {
"mimeType": "application/json",
"text": "{

"id":"4f86955df24634440f000014/home/ec2-user/test",
"type":"",
"status":"",
"text":"test",
"parentId":"4f86955df24634440f000014/home/ec2-user",
"leaf":false
}"
}


"method": "GET",
"url": "http://localhost:3000/fs2http?_dc=1334301520558&node=4f86955df24634440f000014%2Fhome&sort=%5B%7B%22property%22%3A%22text%22%2C%22direction%22%3A%22ASC%22%7D%5D",
"queryString": [
{
"name": "_dc",
"value": "1334301520558"
},
{
"name": "node",
"value": "4f86955df24634440f000014/home"
},
],