码迷,mamicode.com
首页 > 其他好文 > 详细

easyui tree基本操作

时间:2016-08-18 09:49:52      阅读:280      评论:0      收藏:0      [点我收藏+]

标签:

特定的业务场景,树控件节点全部采用异步方式加载,涉及到树控件节点的增,删,改操作,代码备忘

首先要初始化一个根节点,并注册节点单击事件以及数据加载完成后默认选择选择第一个子节点。

<ul id="tree" class="easyui-tree" 
data-options="data: [{text: ‘根节点‘,id: ‘root‘}],
animate:true,
onClick:treeClick,
lines: true,
onLoadSuccess: function (node, data) {if(data.length>2){var n = $(‘#tree‘).tree(‘find‘, data[0].id);$(‘#tree‘).tree(‘select‘, n.target);}}">

 根据异步获取的后端数据增加节点

        function buildTree(data) {
            remove();
            var selected = $(‘#tree‘).tree(‘getSelected‘);
            var nodes = [];
            var ldata = eval(data);
            for (var d = 0; d < ldata.length; d++) {
                var objNode = {};
                objNode.id = "init-" + ldata[d].IDENTITY;
                objNode.text = ldata[d].NAME;
                nodes.push(objNode);
            }
            $(‘#tree‘).tree(‘append‘, {
                parent: selected.target,
                data: nodes
            });
        }

修改节点

 function UpdateNode(content) {
            var selected = $(‘#tree‘).tree(‘getSelected‘);
            $(‘#tree‘).tree(‘update‘, {
                target: selected.target,
                text: content
            });
        }

删除节点,删除除初始化的根节点外所有子节点

  function remove() {
            var objTree = $("#tree");
            var root = objTree.tree(‘find‘, ‘root‘);
            var children = objTree.tree(‘getChildren‘, root.target);
            for (var temp in children) {
                objTree.tree(‘remove‘, children[temp].target);
            }
            objTree.tree(‘select‘, root.target);
        }

 

easyui tree基本操作

标签:

原文地址:http://www.cnblogs.com/jingsha/p/5782706.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!