博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
使用Ztree 默认的增删改操作 和 自定义增删改按钮(是操作数据库实例,比较简单的修改了下)...
阅读量:4150 次
发布时间:2019-05-25

本文共 5619 字,大约阅读时间需要 18 分钟。

 

此处 是默认的按钮:

var setting = {				async: {            enable: true,            url:getPath()+"/manager/buildinfo/typeTree",            dataFilter: null        },        		view: {			addHoverDom: addHoverDom,//当用户鼠标移动到节点上时,显示用户自定义控件,显示隐藏状态同zTree内部的编辑,删除按钮			removeHoverDom: removeHoverDom//移出节点时,显示隐藏状态同zTree内部的编辑、删除按钮		},		data: {			simpleData: {				enable: true			}		}	};	//鼠标在节点获取焦点显示添加按钮	function addHoverDom(treeId, treeNode) {		var sObj = $("#" + treeNode.tId + "_span");		if (treeNode.editNameFlag || $("#addBtn_"+treeNode.tId).length>0){			return;		}		if (treeNode.editNameFlag || $("#delBtn_"+treeNode.tId).length>0){			return;		}		if (treeNode.editNameFlag || $("#updBtn_"+treeNode.tId).length>0){			return;		} 		//删除		if(treeNode.isShowDeleteBut){			var delStr = "删除";			sObj.after(delStr);		}		//修改		if(treeNode.isShowUpdateBut){			var updStr = "修改";			sObj.after(updStr);		}		//添加		if(treeNode.isShowInsertBut){			var addStr = "添加";			sObj.after(addStr);		}	};			//隐藏按钮	function removeHoverDom(treeId, treeNode) {		$("#addBtn_"+treeNode.tId).unbind().remove();		$("#updBtn_"+treeNode.tId).unbind().remove();		$("#delBtn_"+treeNode.tId).unbind().remove();	};	//添加	function addNode(id,name){		var url = getPath()+"/manager/buildinfo/toAddJsp?structureid="+id;		location.href = url;	}	//修改	function updateNode(id){		var url = getPath()+"/manager/buildinfo/toUpdateJsp";		location.href = url+"?id="+id+"&isAdd=2";	}	//删除	function deleteNode(id,name){		layer.confirm('您确定要删除 -->'+ name + "吗?", function(){ 			var url = getPath()+"/manager/buildinfo/deleteBuildInfo";			var param = {"id":id,"time" : Math.random()};			$.post(url,param,function(data){				if("error" == data){					layer.alert('对不起,你所删除的建筑信息,再被其他地方所使用,您不能删除!', 3);					return false;				}else if("success" == data){					layer.msg('删除成功!', 2, -1);					location.href =getPath()+ "/manager/peizhiManager/buildinfo/buildinfoTree.jsp";				}else if("syncError" == data){					layer.msg('删除操作失败!', 2, -1);				}			});		});	}	$(document).ready(function(){		//加载树结构数据		$.fn.zTree.init($("#treeDemo"), setting);	});
 

 

样式如下:

 

 

 

     

    数据格式 JSON

    [	{"name":"四川大学","id":"1a","pId":"0a","open":false,"checked":true,"isShowDeleteBut":true,"isShowUpdateBut":true,"isShowInsertBut":true,"isBuildInfoNodeId":false,"isBuildStructureId":false},	{"name":"四川大学南校区","id":"2a","pId":"1a","open":false,"checked":false,"isShowDeleteBut":true,"isShowUpdateBut":true,"isShowInsertBut":true,"isBuildInfoNodeId":false,"isBuildStructureId":false},	{"name":"电子科技大学","id":"3a","pId":"0a","open":false,"checked":false,"isShowDeleteBut":true,"isShowUpdateBut":true,"isShowInsertBut":true,"isBuildInfoNodeId":false,"isBuildStructureId":false},	{"name":"电子科技大学北校区","id":"4a","pId":"3a","open":false,"checked":false,"isShowDeleteBut":true,"isShowUpdateBut":true,"isShowInsertBut":true,"isBuildInfoNodeId":false,"isBuildStructureId":false},	{"name":"成都财经大学","id":"5a","pId":"0a","open":false,"checked":false,"isShowDeleteBut":true,"isShowUpdateBut":true,"isShowInsertBut":true,"isBuildInfoNodeId":false,"isBuildStructureId":false},	{"name":"成都财经大学南校区","id":"6a","pId":"5a","open":false,"checked":false,"isShowDeleteBut":true,"isShowUpdateBut":true,"isShowInsertBut":true,"isBuildInfoNodeId":false,"isBuildStructureId":false}]

     

    数据自己在后台直接通过一个 对象封装就OK了

    import java.util.List;/** * 站点树,节点对象 * @author ibm * */public class ZTreeNode {		private String name;	private String id;	private String pId;	private List
    childList; private String icon; //是否是打开状态 默认不打开 private boolean open = false; //判断是否选中 private boolean checked = false; //判断是否是可选的 如果为 true 则此节点不可选 private boolean nocheck = false; //控制是否显示 增删改按钮 默认都是不显示 private boolean isShowDeleteBut = false; private boolean isShowUpdateBut = false; private boolean isShowInsertBut = false; //判断是否是建筑信息节点Id private boolean isBuildInfoNodeId; //判断是否是建筑结构节点Id private boolean isBuildStructureId; public String getId() { return id; } public void setId(String id) { this.id = id; } public String getpId() { return pId; } public void setpId(String pId) { this.pId = pId; } public String getName() { return name; } public void setName(String name) { this.name = name; } public List
    getChildList() { return childList; } public void setChildList(List
    childList) { this.childList = childList; } public String getIcon() { return icon; } public void setIcon(String icon) { this.icon = icon; } public boolean isOpen() { return open; } public void setOpen(boolean open) { this.open = open; } public boolean isShowDeleteBut() { return isShowDeleteBut; } public void setShowDeleteBut(boolean isShowDeleteBut) { this.isShowDeleteBut = isShowDeleteBut; } public boolean isShowUpdateBut() { return isShowUpdateBut; } public void setShowUpdateBut(boolean isShowUpdateBut) { this.isShowUpdateBut = isShowUpdateBut; } public boolean isShowInsertBut() { return isShowInsertBut; } public void setShowInsertBut(boolean isShowInsertBut) { this.isShowInsertBut = isShowInsertBut; } public boolean isBuildInfoNodeId() { return isBuildInfoNodeId; } public void setBuildInfoNodeId(boolean isBuildInfoNodeId) { this.isBuildInfoNodeId = isBuildInfoNodeId; } public boolean isBuildStructureId() { return isBuildStructureId; } public boolean isChecked() { return checked; } public void setChecked(boolean checked) { this.checked = checked; } public void setBuildStructureId(boolean isBuildStructureId) { this.isBuildStructureId = isBuildStructureId; } public boolean isNocheck() { return nocheck; } public void setNocheck(boolean nocheck) { this.nocheck = nocheck; }}

     

     

    以上直接是操作数据库的  比较简单的实现。

     

    转载地址:http://oslti.baihongyu.com/

    你可能感兴趣的文章
    Spring MVC中使用Thymeleaf模板引擎
    查看>>
    深入了解php底层机制
    查看>>
    PHP中的stdClass 【转】
    查看>>
    XHProf-php轻量级的性能分析工具
    查看>>
    OpenCV gpu模块样例注释:video_reader.cpp
    查看>>
    就在昨天,全球 42 亿 IPv4 地址宣告耗尽!
    查看>>
    Mysql复制表以及复制数据库
    查看>>
    Linux分区方案
    查看>>
    如何使用 systemd 中的定时器
    查看>>
    linux进程监控和自动重启的简单实现
    查看>>
    OpenFeign学习(三):OpenFeign配置生成代理对象
    查看>>
    OpenFeign学习(四):OpenFeign的方法同步请求执行
    查看>>
    OpenFeign学习(六):OpenFign进行表单提交参数或传输文件
    查看>>
    Ribbon 学习(二):Spring Cloud Ribbon 加载配置原理
    查看>>
    Ribbon 学习(三):RestTemplate 请求负载流程解析
    查看>>
    深入理解HashMap
    查看>>
    XML生成(一):DOM生成XML
    查看>>
    XML生成(三):JDOM生成
    查看>>
    Ubuntu Could not open lock file /var/lib/dpkg/lock - open (13:Permission denied)
    查看>>
    collect2: ld returned 1 exit status
    查看>>