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"}]

 

水平有限,欢迎批评指正!

转载于:https://www.cnblogs.com/kakayang/p/6611631.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值