Ztree菜單樹數據回顯,分兩部分查詢數據:

　　　　其一: 根據實體id查詢出其關聯的菜單數據

　　　　其二: 查詢所有的菜單數據.

然後,使用Ztree API中進行菜單數據回顯的數據進行回顯數據,勾選菜單復選框.

代碼

 1 //2.設置菜單樹的全局變量
 2                 var setting = {
 3                     data : {
 4                         key : {
 5                             title : "t"
 6                         },
 
 7                         simpleData : {            //開啟簡單數據
 8                             enable : true,
 9                         }
10                     },
11                     check : {                    //開啟菜單復選框
12                         enable : true,
13                     }
14                 };    
 
15 
16 　　　　　/*回顯菜單樹數據             --start*/
17               
20                     //根據角色id 使用ajax遠程加載角色關聯的json菜單數據
21                     $.post("${pageContext.request.contextPath}/menuAction_findMenuByRoleId.action", {
22                         "id" : rowData.id
23                     }, function(data) {
 
24                         //alert(data);
25                         treeNode = data;
26                     },‘json‘);    
27                         
28                     
29                     //3.ajax動態查取菜單樹全部節點數據(ztreeNodes)即:data
30                     $.ajax({
31                         url : ‘${pageContext.request.contextPath}/menuAction_findAll.action‘,
32                         type : ‘POST‘,
33                         dataType : ‘json‘,
34                         success : function(data) {
35                             
36                             //4.初始化ztree
37                             $.fn.zTree.init($("#menuTree"), setting, data);
38                             
39                             //當角色關聯的菜單數據長度大於0時,遍歷角色關聯的菜單數據
40                             if (treeNode.length > 0) {
41                                 
42                                 //獲取ztree對象
43                                 var treeObj = $.fn.zTree.getZTreeObj("menuTree");
44                                 
45                                 //遍歷勾選角色關聯的菜單數據
46                                 for (var i = 0; i < treeNode.length; i++) {
47                                     
48                                 //根據角色菜單節點數據的屬性搜索，獲取與完整菜單樹完全匹配的節點JSON對象集合
49                                 var nodes = treeObj.getNodesByParam("id", treeNode[i].id, null);
50                                     
51                                 //勾選當前選中的節點
52                                 treeObj.checkNode(nodes[0],true,true);
53                                     
54                                 };
55                             };
56                         },
57                         error : function(msg) {
58                             alert(‘樹加載異常!‘);
59                         }
60                     });
61             
62            /*回顯菜單樹             --end*/

// 點擊更新
$(‘#updateRole‘).click(function(){

if($("#editRoleForm").form("validate")){
var treeObj = $.fn.zTree.getZTreeObj("menuTree");
var nodes = treeObj.getCheckedNodes(true);//在提交表單之前將選中的checkbox收集
var array = new Array();
for(var i=0;i<nodes.length;i++){
array.push(nodes[i].id);
}
var menuIds = array.join(",");
$("input[name=menuIds]").val(menuIds);//將獲取的菜單選項賦值給隱藏域,從而將數據傳到後臺
$("#editRoleForm").submit();
}
});

Ztree菜單樹數據回顯