Creating Extjs tree panel from xmlDocument which is saved in global constant

Question

I am working on creating tree panel in Extjs version 3.2.1 , i have code to construct a tree from xml document(tree.xml) which is available in my server which is working fine .

But i am in new situation,Where my response is saved in global constant variable

From Ext.Ajax request i got response and saved like following

global_const = response.responseXML;

My Question is , How i can pass this global_const into treeloader?

Any help and suggestion is thankful

Answer 1

I used json instead xml

var Tree = Ext.tree;

    var tree = new Tree.TreePanel('tree', {
        animate:true,
        enableDD:false,
    loader: new Tree.TreeLoader(), // Note: no dataurl, register a TreeLoader to make use of createNode()
    lines: true,
    selModel: new Ext.tree.MultiSelectionModel(),
        containerScroll: false
    });


    // json data describing the tree
    var json = 
[ 
 {"text" : "Audi", "id" : 100, "leaf" : false, "cls" : "folder", "children" : [ 
    {"text" : "A3", "id" : 1000, "leaf" : false, "cls" : "folder", "children" : 
        [ {"text" : "Fuel Economy", "id" : "100000", "leaf" : true, "cls" : "file"},
          {"text" : "Invoice", "id" : "100001", "leaf" : true, "cls" : "file"},
          {"text" : "MSRP", "id" : "100002", "leaf" : true, "cls" : "file"},
          {"text" : "Options", "id" : "100003", "leaf" : true, "cls" : "file"},
          {"text" : "Specifications", "id" : "100004", "leaf" : true, "cls" : "file"}
        ]
    },
    {"text" : "TT", "id" : 1000, "leaf" : false, "cls" : "folder", "children" : 
        [ {"text" : "Fuel Economy", "id" : "100000", "leaf" : true, "cls" : "file"},
          {"text" : "Invoice", "id" : "100001", "leaf" : true, "cls" : "file"},
          {"text" : "MSRP", "id" : "100002", "leaf" : true, "cls" : "file"},
          {"text" : "Options", "id" : "100003", "leaf" : true, "cls" : "file"},
          {"text" : "Specifications", "id" : "100004", "leaf" : true, "cls" : "file"}
        ]
    }]
 },
 {"text" : "Cadillac", "id" : 300, "leaf" : false, "cls" : "folder", "children" : [ 
    {"text" : "CTS", "id" : 1000, "leaf" : false, "cls" : "folder", "children" : 
        [ {"text" : "Fuel Economy", "id" : "100000", "leaf" : true, "cls" : "file"},
          {"text" : "Invoice", "id" : "100001", "leaf" : true, "cls" : "file"},
          {"text" : "MSRP", "id" : "100002", "leaf" : true, "cls" : "file"},
          {"text" : "Options", "id" : "100003", "leaf" : true, "cls" : "file"},
          {"text" : "Specifications", "id" : "100004", "leaf" : true, "cls" : "file"}
        ]
    },
    {"text" : "CTS-V", "id" : 1000, "leaf" : false, "cls" : "folder", "children" : 
        [ {"text" : "Fuel Economy", "id" : "100000", "leaf" : true, "cls" : "file"},
          {"text" : "Invoice", "id" : "100001", "leaf" : true, "cls" : "file"},
          {"text" : "MSRP", "id" : "100002", "leaf" : true, "cls" : "file"},
          {"text" : "Options", "id" : "100003", "leaf" : true, "cls" : "file"},
          {"text" : "Specifications", "id" : "100004", "leaf" : true, "cls" : "file"}
        ]
    }]
 }

];

    // set the root node
    var root = new Tree.AsyncTreeNode({
        text: 'Autos',
        draggable:false,
        id:'source',
        children: json
    });

    tree.setRootNode(root);

    tree.render();
    root.expand();