1. 程式人生 > >asp.net mvc easyui tree

asp.net mvc easyui tree

ole http for serialize quest form 加載 col new

1、html頁面代碼:  

<div class="easyui-panel" style="padding:5px" id="powerTree">            
        </div>

2、js代碼:

需要返回數據格式如下:

[
{"id":1,"parendId":0,"name":"123"},
{"id":2,"parentId":1,"name":"456"},
{"id":3,"parentId":1,"name":"789"},
{"id":4,"parentId":2,"name":"444444"},
]

代碼如下:

$(‘#powerTree‘).tree({
            url: 
‘/Sys/GetRolePower‘, method: ‘post‘, checkbox: false,//定義是否在每個節點前邊顯示復選框 onBeforeLoad: function (node, param) { param.id = id //傳參數 }, loadFilter: function (rows) { return convert(rows.data); }, onLoadError:
function (ex) { $.messager.alert(‘消息‘, "加載失敗", ‘error‘); } }); function convert(rows) { rows = JSON.parse(rows);//json轉對象 function exists(rows, parentId) { for (var i = 0; i < rows.length; i++) { if (rows[i].id == parentId) return
true; } return false; } var nodes = []; for (var i = 0; i < rows.length; i++) { var row = rows[i]; if (!exists(rows, row.parentId)) { 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) { var node = toDo.shift(); for (var i = 0; i < rows.length; i++) { var row = rows[i]; if (row.parentId == node.id) { var child = { id: row.id, text: row.name }; if (node.children) { node.children.push(child); } else { node.children = [child]; } toDo.push(child); } } } return nodes; }

3、後端代碼:

[HttpPost]
        public JsonResult GetRolePower()
        {
            int roleId = Convert.ToInt32(HttpContext.Request.Form["id"]);

            var treeList = GetData(roleId);
            var roleTree = from item in treeList
                                select new
                                {
                                    id = item.id,
                                    parentId = item.pId,
                                    name = item.Name
                                };
            var data = JsonConvert.SerializeObject(roleTree);

            return Json(new { data }, JsonRequestBehavior.AllowGet);
        }

asp.net mvc easyui tree