easyui中带checkbox框的tree

var data = [{
            "id": 1,
            "checked":true,
            "text": "系统菜单",
            "children": [{
                "id": 11,
                "text": "用户管理",
                "checked":true,
                "children": [{
                    "id": 19,
                    "text": "增加用户"
                }, {
                    "id": 3,
                    "text": "修改用户"
                }, {
                    "id": 5,
                    "text": "删除用户",
                    "checked":true
                }]
            }, {
                "id": 12,
                "text": "角色管理",
                "children": [{
                    "id": 13,
                    "text": "增加角色",
                    "checked":true
                }, {
                    "id": 3,
                    "text": "修改角色"
                }, {
                    "id": 5,
                    "text": "删除角色"
                }]
            }]
        }, {
            "id": 2,
            "text": "其他",
            "state": "closed"
        }];
        
        $(function () {
            $("#tt").tree({
                data: data,
                checkbox: true,
                cascadeCheck: false,
                onCheck: function (node, checked) {
                    if (checked) {
                        var parentNode = $("#tt").tree('getParent', node.target);
                        if (parentNode != null) {
                            $("#tt").tree('check', parentNode.target);
                        }
                    } else {
                        var childNode = $("#tt").tree('getChildren', node.target);
                        if (childNode.length > 0) {
                            for (var i = 0; i < childNode.length; i++) {
                                $("#tt").tree('uncheck', childNode[i].target);
                            }
                        }
                    }
                }
            });
        });

        function getChecked()
        {
            var arr = [];
            var checkeds = $('#tt').tree('getChecked', 'checked');
            for (var i = 0; i < checkeds.length; i++) {
                arr.push(checkeds[i].id);
            }
            alert(arr.join(','));
        }

         <ul id="tt"></ul>
    <input type="button" value="获取选中" onclick="getChecked()" />

但是有时候我们从后台返回list,

然后将list转换成一个Tree.   easyui根据这个数据生成一个树.

那么如何将list转换成一棵树的基本代码就要查看上面一片博客了(http://www.cnblogs.com/guoyansi19900907/p/4701746.html)

现在给出从数据库获取数据,根据指定数据来控制树的选中和未选中状态.

下面这段代码是将list的数据转换成tree,并且加入checked=true或false来控制选中,未选中.

/**
 * checkbox 树
 * @param rows
 * @param param
 * @returns {Array}
 */
function convertCheckbox(rows,param){
    /*for(var gys=0;gys<rows.length;gys++){
        console.log(rows[gys]["if_fuquan"]);
    }*/
    function getTreeCheck(n){
        if(n==1){
            return true;
        }else{
            return false;
        }
    }
    
    
    function exists(rows, parentId){
        for(var i=0; i<rows.length; i++){
            if (rows[i][param.id] == parentId) return true;
        }
        return false;
    }
    
    var nodes = [];
    // 获取顶级的node
    for(var i=0; i<rows.length; i++){
        var row = rows[i];
        if (!exists(rows, row[param.parentId])){
            
            //gys    给顶层添加链接
            var topNode={id:row[param.id],text:row[param.name],checked:getTreeCheck(row[param.checked])};                
            nodes.push(topNode);
            
            // nodes.push({
                //id:row.id,
                //text:row.name
            //}); 
        }
    }
    
    var toDo = [];
    for(var i=0; i<nodes.length; i++){
        toDo.push(nodes[i]);
    }
    while(toDo.length){//循环toDo当toDo长度为零时停止
        var node = toDo.shift();//删除第一个元素,然后返回第一个元素,改变数组长度    
        // 获取子节点
        for(var i=0; i<rows.length; i++){
            var row = rows[i];
            if (row[param.parentId] == node.id){
                var child = {id:row[param.id],text:row[param.name]};
                // gys 添加链接
                
                //if(row[param.checked]){
                //alert(row[param.checked]);
                    child.checked=getTreeCheck(row[param.checked]);
                //}
                if (node.children){
                    node.children.push(child);
                } else {
                    node.children = [child];
                }
                toDo.push(child);
            }
        }
    }
    return nodes;
}

var objTree= $("#fuquanTree");
             objTree.tree({
                    url:"data.json",
                    method: 'get',
                    checkbox:true,
                    cascadeCheck: false,
                    loadFilter:function(data){//这里的privilege_id,privilege_name,if_fuquan,parent_privilege_id对应的都是数据库的字段.
                        return convertCheckbox(data,{id:"privilege_id",name:"privilege_name",checked:"if_fuquan",parentId:"parent_privilege_id"});
                    },
                    onCheck: function (node, checked) {
                        if (checked) {
                            var parentNode =objTree.tree('getParent', node.target);
                            if (parentNode != null) {//选中子集时,父级没选中就选中父级
                                objTree.tree('check', parentNode.target);
                            }
                        } else {//取消选中,如果有子集就取消选中子集
                            var childNode = objTree.tree('getChildren', node.target);
                            if (childNode.length > 0) {
                                for (var i = 0; i < childNode.length; i++) {
                                    objTree.tree('uncheck', childNode[i].target);
                                }
                            }
                        }
                    }
                });