ztree简单用法

版权声明：内容记录学习过成文章，仅供参考 https://blog.csdn.net/qq_40195958/article/details/80939566

初始化数据

var settingCatalog = {
//通过ajax进行数据加载
		async: {
			enable: true,
			contentType: "application/json",
			url: "",
			autoParam: ["id","name"],
		},
//格式化数据格式
		data: {
            simpleData: {                
                enable: true,            // 简单数据模式
                idKey: "id",    
                name:"name",
                pIdKey: "pId",    
                rootPId: null              
            }
        },
//回调函数双击        
        callback:{
        	onDblClick:loadItemList
        }
};
//ztree初始化操作
$.fn.zTree.init($("#departmentTree1"), settingCatalog);

后台数据格式为json

  List<Map<String,Object>> list = new ArrayList<>();
        Map<String,Object> map = null;
        map = new HashMap<>();
        map.put("id", area.getKeyid());
        map.put("pId", -1);
        map.put("name", area.getName());
        map.put("isParent", true);
        map.put("rootPid", "null");
        list.add(map);
        for(Structure i : structrueList){
        	Map<String,Object>map1 = new HashMap<String, Object>();
        	map1.put("id", i.getKeyid());
        	map1.put("icon", "plugins/zTree_v3/css/zTreeStyle/img/diy/7.png");//修改某个图标，相对路径
        	map1.put("iconOpen","url");//展开节点图片
        	map1.put("iconClose","url");//合上时图片
        	map1.put("pId", area.getKeyid());
        	map1.put("name", i.getName());
        	map1.put("rootPid", "null");
        	list.add(map1);
        }
   return list;  //这里框架为封装json，转换为json返回给前台   

回调函数取节点数据

function loadItemList(event,parentNode,treeNode){
//	 alert(treeNode.id);
//	 回调函数取节点数据
	 var departmentId = treeNode.id;
	 var deprtmentName = treeNode.name;
	 var matter = {
			 query:{
				 "departmentId":departmentId,
			 }
	 }
//bootstrapTable  进行刷新操作	 
	 $('#matterLsit').bootstrapTable("refresh",matter);
 }

树select勾选回写

//  获取ztree初始化数据
zTree = $.fn.zTree.init($("#runNameTree"), setting);
// 去id集合
var name = $("id").val();
	if(name != ''){
		var names = JSON.parse(name);
		for(var j=0;j<names.length;j++){
			var node = zTree.getNodeByParam("id",names[j].staffid,null);
			if(node != null){
				//  设置id相等的节点为选中状态
				zTree.checkNode(node,true);
			}
		}
	}