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);
                                }
                            }
                        }
                    }
                });