Spring MVC + Mybatis + zTee 实现一个可增、删、改的无限级树
这两天帮老师做了树的增加、删除、修改的功能，查阅了不少资料，在这里分享下一些心得体会。
在这里我选用的是Spring MVC3.2.3 + Mybatis3.2.2 + zTree3.5.14
一：数据库的设计
数据库用的是SQLServer 2008（老师让用SQLServer，郁闷.....）
数据库名：tree，目前就一张表：menuitem
表很简单目前就三个字段(mid int primary,pid int,name varchar)
初始一个值为(1,0,‘地块管理’)
二：最重要的前台加载tree
（一）tree.jsp 位于WEB-INF/jsp/tree.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>tree.jsp</title>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/zTreeStyle/zTreeStyle.css">
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.10.2.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.ztree.core-3.5.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.ztree.exedit-3.5.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/tree.js"></script>
<style type="text/css">/*设置增加按钮的css样式*/
.ztree li span.button.add {margin-left:2px; margin-right: -1px; background-position:-144px 0; vertical-align:top; *vertical-align:middle}
</style>
</head>
<body>
<ul id="tree" class="ztree"></ul>
</body>
</html>
（二）最重要的 tree.js 位于js/tree.js
tree.js负责前台到后台的数据的交换
下面是tre.js的代码
var tree = {
zTree : null,
max : null,
setting : {
view : {
selectedMulti : false,
addHoverDom : function(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(){
var parameter = {
mid:++tree.max,
pid:treeNode.mid,
name:"新节点 " + tree.max
};
tree.zTree.addNodes(treeNode, parameter);
/**
* 处理添加节点
*/
$.post("menuitem/insert",parameter);
return false;
});
},
removeHoverDom : function(treeId, treeNode){
$("#addBtn_"+treeNode.tId).unbind().remove();
}
},
data : {
simpleData : {
enable : true,
idKey : "mid",
pIdKey : "pid"
}
},
edit : {
editNameSelectAll : true,
enable :true,
removeTitle : "删除",
renameTitle : "修改",
drag : {
autoExpandTrigger : false,
isMove : false,
isCopy : false,
prev : false,
next : false,
inner : false
}
},
callback : {
beforeRename : function(treeId, treeNode, newName, isCancel){
if(newName.trim().length == 0){
alert("名称不能为空或空格！");
return false;
}
return window.confirm("确定将 " + treeNode.name + " 修改为 " + newName + " 吗？");
},
onRename : function(event, treeId, treeNode, isCancel){
/**
* 处理更改名称
*/
var parameter = {
mid : treeNode.mid,
name : treeNode.name
};
$.post("menuitem/update", parameter);
},
beforeRemove : function(treeId, treeNode){
return window.confirm("确定删除 " + treeNode.name + " 及其所有子节点吗？");
},
onRemove : function(event, treeId, treeNode){
/**
* 处理删除节点信息
*/
var parameter = {
mid : treeNode.mid
};
$.post("menuitem/deleteById", parameter);
var nodes = tree.zTree.transformToArray(treeNode.children);
$.each(nodes,function(index,node){
var parameter = {
mid : node.mid
};
$.post("menuitem/deleteById", parameter);
});
}
}
},
loadTree : function() {
$.post("menuitem/getAll", null, function(data) {
tree.zTree = $.fn.zTree.init($("#tree"), tree.setting, data);
});
$.post("menuitem/getMax", null, function(data) {
tree.max = data;
});
}
};
$(document).ready(function() {
tree.loadTree();
});
就这么多了，最后附上整个项目
相关推荐
SSM(spring+spring MVC+mybatis)开发学生信息后台管理系统,实现学生增删改查功能设计一个简单的学生信息管理系统，要求使用SSM框架技术整合实现，用户登录后能够通过Web页面添加、删除、修改和查询学生信息 ...
Java EE企业级应用开发教程（Spring+Spring MVC+MyBatis）SSM源码Java EE企业级应用开发教程（Spring+Spring MVC+MyBatis）SSM源码Java EE企业级应用开发教程（Spring+Spring MVC+MyBatis）SSM源码Java EE企业级应用...
在本文中，我们将深入探讨如何使用JavaEE技术栈，特别是Spring、Spring MVC和MyBatis框架，来构建一个超市货物管理系统的实现。这个系统涵盖了基本的登录功能以及与MySQL数据库的交互，包括增删改查操作和分页显示。...
这是通过ssm+layui 实现的简单的对数据表格的增删改查，所有页面纯由layui实现。如果你是新手学习layui，那这个绝对会对你有很大的帮助； 如果你之前已经学过甚至已经使用过,那这个可以当做一个参考
项目描述 学生成绩管理系统，有三...spring boot+spring mvc+mybatis+layui+jquery+thymeleaf http://localhost:8080/Sys/loginView 管理员账号 admin admin 老师登录 2020031920 111111 学生账号登录 20200319 111111
Maven+Spring+Spring MVC+MyBatis+MySQL，搭建SSM框架环境
基于ssm(spring+spring mvc+mybatis+maven)高仿bilibili视频网站项目源码.zip 基于ssm(spring+spring mvc+mybatis+maven)高仿bilibili视频网站项目源码.zip 基于ssm(spring+spring mvc+mybatis+maven)高仿bilibili...
Spring MVC是Spring的一部分，它是一个构建Web应用的模型-视图-控制器（MVC）框架；而MyBatis是一个支持定制化SQL、存储过程以及高级映射的持久层框架。接下来，我们来详细探讨这些框架的整合使用中的关键知识点。 ...
毕设项目基于Spring + Spring MVC + Mybatis的销售管理系统源码.zip毕设项目基于Spring + Spring MVC + Mybatis的销售管理系统源码.zip毕设项目基于Spring + Spring MVC + Mybatis的销售管理系统源码.zip毕设项目...
基于ssm(spring+spring mvc+mybatis+maven)实现的高仿bilibili视频网站+源码+开发文档，适合毕业设计、课程设计、项目开发。项目源码已经过严格测试，可以放心参考并在此基础上延申使用~ 基于ssm(spring+spring mvc...
这是一个基于Spring MVC、Mybatis和Spring框架实现的个人博客系统，涵盖了Web开发中的后端架构设计、数据库管理和前端展示等多个方面。以下将详细介绍这个系统的关键知识点： **1. Spring MVC** Spring MVC是Spring...
在IT行业中，构建Web应用程序是一项常见的任务，而“基于maven+spring+spring mvc+mybatis框架web项目”提供了一个适用于初学者的学习路径。这个项目利用了四个关键的技术组件，它们分别是Maven、Spring、Spring MVC...
包含课设要求所有资源 基于Spring + Spring MVC + MyBatis的图书馆管理系统，使用Maven进行包管理。主要功能包括：图书查询、图书管理、图书编辑、读者管理、图书的借阅与归还以及借还日志记录等。
《构建基于Spring MVC+MyBatis+EasyUI+UEditor+Shiro的权限管理框架系统》 在现代企业级Web应用开发中，高效、安全、易维护的框架选择至关重要。本项目采用Spring MVC、MyBatis、EasyUI、UEditor以及Shiro这五大...
这个项目"spring mvc + mybatis + maven + easyui + oracle 数据库实现增删改查"就是一个典型的例子，它整合了五个关键组件来完成常见的CRUD（创建、读取、更新和删除）操作。以下是对这些技术及其相互作用的详细...
使用环境：MyEclipse/Eclipse + Tomcat + MySQL。 使用技术：Spring MVC + Spring + MyBatis / JSP + Servlet + JavaBean + JDBC。
总的来说，这个基于Spring + Spring MVC + MyBatis的图书馆管理系统，充分展示了Java企业级开发的强大之处，通过合理的技术选型和设计模式，实现了功能完善的图书管理服务，同时也为开发者提供了良好的开发体验和...
spring+mvc+mybatis+mysql+jsp 实现用户登录、注册功能 进入系统，实现用户的查询、修改、删除、更新 导入项目，请修改数据库配置文件，运行创建表并插入数据 初始登录用户名：admin1 密码：123456
Spring MVC作为Spring框架的一部分，是用于构建Web应用程序的模型-视图-控制器（MVC）架构，而Mybatis则是一个轻量级的持久层框架，主要用于处理SQL数据库的增删改查操作。这两个框架的结合，可以提供高效且灵活的...