我可以在ztree中创建动态节点吗?

时间:2014-05-17 18:11:17

标签: jquery ztree

这里是ztree代码示例....
                                                                              

        <SCRIPT type="text/javascript">

            var setting = {
                data: {
                    simpleData: {
                        enable: true
                    }
                }
            };

            var zNodes =[
                { id:1, pId:0, name:"pNode 1", open:true},
                { id:11, pId:1, name:"pNode 11"},
                { id:111, pId:11, name:"leaf node 111"},
                { id:112, pId:11, name:"leaf node 112"},
                { id:113, pId:11, name:"leaf node 113"},
                { id:114, pId:11, name:"leaf node 114"},
                { id:12, pId:1, name:"pNode 12"},
                { id:121, pId:12, name:"leaf node 121"},
                { id:122, pId:12, name:"leaf node 122"},
                { id:123, pId:12, name:"leaf node 123"},
                { id:124, pId:12, name:"leaf node 124"},
                { id:13, pId:1, name:"pNode 13 - no child", isParent:true},
                { id:2, pId:0, name:"pNode 2"},
                { id:21, pId:2, name:"pNode 21", open:true},
                { id:211, pId:21, name:"leaf node 211"},
                { id:212, pId:21, name:"leaf node 212"},
                { id:213, pId:21, name:"leaf node 213"},
                { id:214, pId:21, name:"leaf node 214"},
                { id:22, pId:2, name:"pNode 22"},
                { id:221, pId:22, name:"leaf node 221"},
                { id:222, pId:22, name:"leaf node 222"},
                { id:223, pId:22, name:"leaf node 223"},
                { id:224, pId:22, name:"leaf node 224"},
                { id:23, pId:2, name:"pNode 23"},
                { id:231, pId:23, name:"leaf node 231"},
                { id:232, pId:23, name:"leaf node 232"},
                { id:233, pId:23, name:"leaf node 233"},
                { id:234, pId:23, name:"leaf node 234"},
                { id:3, pId:0, name:"pNode 3 - no child", isParent:true}
            ];

            $(document).ready(function(){
                $.fn.zTree.init($("#treeDemo"), setting, zNodes);
            });

        </SCRIPT>
     </HEAD>

    <BODY>

    <div class="content_wrap">
        <div class="zTreeDemoBackground left">
            <ul id="treeDemo" class="ztree"></ul>
        </div>
    </div>
    </BODY>
    </HTML>

这是我在谷歌上找到的ztree示例代码。我想知道我可以创建动态节点吗?             $ .fn.zTree.init($(“#treeDemo”),设置, zNodes );我可以动态创建 zNodes 吗?

2 个答案:

答案 0 :(得分:0)

你可以尝试类似的东西

var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
var newNode = { id:222, pId:22, name:"leaf node 222"};
newNode = treeObj.addNodes(null, newNode);

并创建一个循环以插入您可能需要的所有节点。

如果你需要一个特定的层次结构,你将不得不关注自动生成的id,pId。

答案 1 :(得分:0)

我有一些带有ajax请求的代码。

$(document).ready(function(){ 
  var zNodes = [];
  $.get('your_url')
  .done(function(x) {
    // x --> this is json data output
    zNodes = x;
    $.fn.zTree.init($("#treeDemo"), setting, zNodes); 
  })
  .fail(function(x) {});
});