zTree

【1】折叠展开<div class=“box-tools pull-right”> <button type=“button” id=“expandfalse” class=“btn btn-box-tool” title=“折叠”> <i class=“fa fa-minus”></i> </button> <button type=“button” id=“expandtrue” class=“btn btn-box-tool” title=“展开”> <i class=“fa fa-plus”></i> </button></div>var zTree = $.fn.zTree.init($("#bid_dept"), setting);$(’#expandfalse’).click(function (e) { e.preventDefault(); zTree.expandAll(false);}); $(’#expandtrue’).click(function (e) { e.preventDefault(); zTree.expandAll(true); });1）html：<ul id=“t_suptype” class=“ztree”></ul>2）js脚本：$(function(){ var setting = { view: { addHoverDom: addHoverDom, removeHoverDom: removeHoverDom, selectedMulti: false }, data : { simpleData : { enable : true, idKey : “id”, pIdKey : “parent” } }, async: { enable: true, url: “base/suptype/tree”, autoParam: [“id”, “t”, “level=lv”], type: “get” }, callback : { onClick : function(e, treeId, treeNode) { //console.log(treeNode); urlDetail = ‘/base/suptype/detail?id=’ + encodeURIComponent(treeNode.id); $(’#supdetails’).load(urlDetail); } } }; var zTree = $.fn.zTree.init($("#t_suptype"), setting); //下面的是设置了新增按钮的和设置了高度的代码 function addHoverDom(treeId, treeNode) { var sObj = $("#" + treeNode.tId + “span”); if (treeNode.editNameFlag || $("#addBtn"+treeNode.tId).length>0) return; var addStr = “<span class=‘button add’ id=‘addBtn_” + treeNode.tId + “’ title=‘增加子项’ onfocus=‘this.blur();’></span>”; sObj.after(addStr); var btn = $("#addBtn_"+treeNode.tId); if (btn) btn.bind(“click”, function(){ $(’#modal-operate’).modal(‘show’); var url = ‘/base/suptype/add?parent=’ + encodeURIComponent(treeNode.id); $(’#modal-operate-body’).load(url); }); }; function removeHoverDom(treeId, treeNode) { $("#addBtn_"+treeNode.tId).unbind().remove(); }; var windowHeight = $(window).height(); var mainheaderH = $(’.main-header’).outerHeight(); var contentheaderH = $(’.content-header’).outerHeight(); var boxorgheaderH = $(’#boxheader’).outerHeight(); var deptlistH = windowHeight - mainheaderH - contentheaderH - boxorgheaderH - 30 - 3; $(’#boxlist’).slimScroll({ height: deptlistH });})3）控制器/** * yyh * 20180817 * 控制器 * @return /@ResponseBody@GetMapping("/tree")@RequiresPermissions(“base:suptype:suptype”)public String tree(){ List<zTreeNode> suptypeList = suptypeService.getTreeAllSuptype(); return JSON.toJSONString(suptypeList);}4）映射文件<select id=“getTreeAllSuptype” resultType=“com.tuodata.bid.common.domain.zTreeNode”> select id,parent,code,name,icon,t,isp,open,s,ls,f from bid_suptype where f = 1</select>5）zTree工具类package com.tuodata.bid.common.domain;import java.io.Serializable;//zTree工具类public class zTreeNode implements Serializable { private static final long serialVersionUID = 1L; private String id; private String parent; private String name; private Boolean open; private Boolean isp; private String icon; private int t; private int s; //省略getter setter @Override public String toString() { return “zTreeNode [id=” + id + “, parent=” + parent + “, name=” + name + “, open=” + open + “, isp=” + isp + “, icon=” + icon + “, t=” + t + “, s=” + s + “]”; } }6）保存后锁定到新增的节点如果zTree中放了添加按钮，这个就是保存成功之后回去页面展开显示新增的节点/* * 保存 */ @ResponseBody @PostMapping("/save") @RequiresPermissions(“base:suptype:add”) public String save( SuptypeDO suptype, @RequestParam(“code”) String code,@RequestParam(“name”) String name){ String uuid = UUID.randomUUID().toString().replace("-", “”); suptype.setCode(code); suptype.setName(name); suptype.setId(uuid); suptype.setF(1); if(suptypeService.save(suptype)>0){ zTreeNode node = new zTreeNode(); node.setId(suptype.getId()); node.setParent(suptype.getParent()); node.setName(suptype.getName()); return JSON.toJSONString(node); } return JSON.toJSONString(R.error()); }【2】禁止获取非文件夹的树的值（观察到复选框是暗色的）check: { enable: true, chkboxType: { “Y” : “”, “N” : "" }}【3】禁止获取非文件夹的树的值（观察到复选框是暗色的）(id, parent, code, name, icon, t, isp, open, s, ls, f)parent：父节点open:是否展开1)树实体的字段对应2)sql脚本3)界面查询【4】判断有无选中节点var t_sup = $.fn.zTree.getZTreeObj(“t_sup”);var tnodes = t_sup.getCheckedNodes();if (tnodes.length == 0) { toastr.warning(“请选择关联的供应商分类”); return;}