extjs 使用TreePanel動態新建一棵數

js代碼如下

/*
         * 品目選擇
         */
        addItemsFun : function() {
             var treeLoader = new Ext.tree.TreeLoader({
                    dataUrl:ctx+'/getTree'
                });
                var Tree = Ext.tree;

                root = new Tree.AsyncTreeNode({
                    text: '產品分類',
                    draggable:false,
                    id:'source'
                });
                tree2 = new Tree.TreePanel({
                    useArrows:true,
                    autoScroll:true,
                    animate:true,
                    width : 400,
                    region : 'center',
                    enableDD:true,
                    border : false,
                    containerScroll: true, 
                    loader: treeLoader,
                    root:root,

                });
              //leftTree, rightForm 
                leftTree = new Ext.Panel({
                    id : "leftTree",
                    width : 200,
                    height : "100%",
                    region : 'west',
                    border : false,
                    margins : '5 5 5 5',
                    layout : 'anchor',
                    defaults : {
                        anchor : '90%'
                    },
                    items : [tree2]
                });

                rightForm = new Ext.Panel({
                    id : "rightForm",
                    width : 400,
                    height : "100%",
                    region : 'center',
                    border : true,
                    margins : '5 5 5 5',
                    layout : 'anchor',
                    defaults : {
                        anchor : '90%'
                    },
                    items : [

                    ]
                });
            if (!win2) {
                win2 = new Ext.Window({
                    title : '品目選擇',
                    layout : 'border',
                    width : 600,
                    height : 500,
                    closeAction : 'hide',
                    plain : true,
                    modal : true,
                    constrain : true,// window不可移動到窗口之外
                    resizable : false,// 不可改變window的大小
                    defaults : {
                        split : true
                    },
                    items : [ leftTree,rightForm],
                    buttonAlign : 'right',
                    buttons : [ {
                        id : 'allowButton',
                        text : '確定',
                        handler : function() {
                            alert("確定");
                        }
                    }, {
                        text : '取消',
                        handler : function() {
                            win2.hide();
                        }
                    } ]
                });



                tree2.on('checkchange', function(node, checked) {   
                    node.expand();   
                    node.attributes.checked = checked;   
                    node.eachChild(function(child) {   
                        child.ui.toggleCheck(checked);   
                        child.attributes.checked = checked;   
                        child.fireEvent('checkchange', child, checked);   
                    });   
                }, tree2);  

                tree2.root.expand();


            }
            win2.show();
        },

action的返回json值格式如下

[{"id":3,"text":"產品類","cls":"folder","children":[{"id":1,"text":"水果類","cls":"file","children":null,"leaf":true,"checked":false},{"id":2,"text":"蔬菜類","cls":"file","children":null,"leaf":true,"checked":false}],"leaf":false,"checked":false}]