1

i am working in extjs4. I have created treepanel view as- MyTree view

Now on clicking on node surrounding,i am retrieving its id,sending it to server side and retriving its corresponding childs. I am getting this serverside output in json format as-

{"children":[{"text":"Subgeo1","leaf":true,"expanded":false,"checked":false},{"text":"Subgeo2","leaf":true,"expanded":false,"checked":false}]}

So now i want to insert this above json elements as childs of node "surrounding". So how to update tree store with this new childs? Or how can i add childs dynamically? please help me

user1722857
  • 877
  • 2
  • 19
  • 33

1 Answers1

0

Here's my example how I add elements on my tree:

on_AddTreeNodes: function (win) {
    var _this = this;
    //your tree
    var tree = win.down('treepanel[name=main_tree]');
    //get tree root
    var root = tree.getRootNode();
    var first = root.firstChild;
    var _index = first.childNodes.length - 1;
    //adding folder
    first.insertChild(_index, { text: 'New folder name', leaf: false });
    var data = first.getChildAt(_index);
    Ext.Ajax.request({
        url: 'your url',
        method: 'GET',
        params: {
            //some params
        },
        success: function (objServerResponse) {
                //if success, you add your data from server into your tree
                            data.insertChild(data.firstChild, {
                               text: 'your leaf name',
                               leaf: true,
                               //your other params
                            });     

    });
    //sync your tree store
    tree.getStore().sync();
}

In my example I use insertChild - this method adding childs in my tree. Here's some information that should help you : work with tree in ExtJs

In my view I have 

Ext.applyIf(me, {
            items: [
                {
                    xtype: 'treepanel',
                    name: 'main_tree',
                    title: 'Menu',
                    region: 'west',
                    collapsible: true,
                    rootVisible: false,
                    viewConfig: {
                        width: 230
                    },
                    store: Ext.create('Ext.data.TreeStore', {
                        root: {
                            expanded: true,
                            children: [
                                        {
                                            text: '',
                                            expanded: true,
                                            children: [
                                                        { text: 'Menu item', leaf: true, param1: 'somedata', param2: 'somedata', param3: 'somedata' },...

and when I use:

data.insertChild(data.firstChild, {
                                   text: 'your leaf name',
                                   leaf: true,
                                   //your other params
                                });

instead '//your other params' you get params from your JSON and write like this:

data.insertChild(data.firstChild, {
                                       text: 'your leaf name',
                                       leaf: true,
                                       param1: 'jsondata', 
                                       param2: 'jsondata', 
                                       param3: 'jsondata'
                                    });
Josh Crozier
  • 233,099
  • 56
  • 391
  • 304
Nail Shakirov
  • 654
  • 1
  • 8
  • 17
  • thanx for reply sir. i am following way you have suggested. i am loading store and getting json output.Code for this is as-"getchildsStore.load({ params:{ data: answers }, callback: function(records,operation,success){ console.log(records);});" But inside callback function i am retriving data as-"[Object { phantom=false, internalId="ext-record-16", raw={...}, more...}, Object { phantom=false, internalId="ext-record-17", raw={...}, more...}]" for my output json. So how to get these new childs in this callback function – user1722857 Jun 11 '13 at 11:27
  • but it's other question, see your question title. There's a link for your second question: http://stackoverflow.com/questions/4935632/how-to-parse-json-in-javascript . Then you get your data, insert childs in loop. – Nail Shakirov Jun 11 '13 at 11:42