zTree根據json選中節點,並且設置其他節點不可選


首先,在適配目錄樹時,使用checkbox形式,配置代碼如下:

 

var settingCatalog = {
     check:{
         enable: true
     },
     data:{
         simpleData:{
             enable: true
         }
     }   
}

看下效果:

這時的每個節點都處於一個可選的狀態(但都未選中),但在實際項目中我們可能還會遇到另外兩種情況:

1、根據后台返回的json,選中指定節點(此時所有的節點仍處於可編輯的狀態);

  

  代碼如下:

  

  var treeObj = $.fn.zTree.getZtreeObj("categoryTree");

  for(var j = 0; j < zNodes.length; j++){

   treeObj.checkNode(treeObj.getNodeByParam("id",zNodes[j].id),true);

  }

 

   zNodes是后台獲取的json數據,其中包括 id、parentId、name、deep,形式如下:

  

2、根據json,選中指定節點,所有節點為不可操作狀態。

  代碼如下: 

/**獲取樹對象*/
var treeObj = $.fn.zTree.getZTreeObj("categoryTree");
/**獲取所有節點*/
var nodes = treeObj.transformToArray(treeObj.getNodes());
for(var i = 0; i < nodes.length; i++){
  for(var j = 0; j < zNodes.length; j++){
    if(nodes[i] === treeObj.getNodeByParam("id",zNodes[j].dataAuthorityId)){
      treeObj.checkNode(treeObj.getNodeByParam("id",zNodes[j].dataAuthorityId),true);
    }
  }
  nodes[i].chkDisabled = true;
}

 

  效果:

  

Tips:

實際項目中,有時需要把選中的節點以json的形式傳給后台,既然要獲取節點,那當然要從節點下手啦:

var json = [];
var treeObj=$.fn.zTree.getZTreeObj("categoryTree");
var nodes=treeObj.getCheckedNodes(true);                                
for(var i = 0; i < nodes.length; i++){                                           
  var obj = {};                                                                        
  obj.dataAuthorityId = nodes[i].id;
  obj.parentId = nodes[i].pId;
  obj.name = nodes[i].name;
  obj.deep = nodes[i].deep;
  json.push(obj);                         
}
json = JSON.stringfy(json); //要作為參數傳給后台,別忘了序列化一下

 

看看我們得到了什么:

[{"dataAuthorityId":"00","parentId":null,"name":"京師目錄體系","deep":"0"},{"dataAuthorityId":"gaozhong","parentId":"00","name":"高中","deep":"1"},{"dataAuthorityId":"gaozhong-shuxue","parentId":"gaozhong","name":"數學","deep":"2"},{"dataAuthorityId":"xiaoxue","parentId":"00","name":"小學","deep":"1"},{"dataAuthorityId":"xiaoxue-shuxue","parentId":"xiaoxue","name":"數學","deep":"2"},{"dataAuthorityId":"xiaoxue-yingyu","parentId":"xiaoxue","name":"英語","deep":"2"}]

 

水平有限,歡迎批評指正!


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM