环境搭建:需要jquery 1.4+,jquery.ztree.core-3.1.min.js,ztree自带的css文件和图片,并且css文件和图片文件夹要处于同一目录(很重要),否则动态树无法正常显示。
数据库的设计:CREATE TABLE `function` (
`id` int(4) NOT NULL AUTO_INCREMENT,
`pid` int(4) DEFAULT NULL,
`name` varchar(20) NOT NULL,
`url` varchar(50) DEFAULT NULL,
`title` varchar(50) DEFAULT NULL,
`target` varchar(50) DEFAULT NULL,
`icon` varchar(50) NOT NULL,
`icon_open` varchar(50) DEFAULT NULL,
`open` varchar(1) DEFAULT NULL COMMENT '0:close 1:open',
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=7 DEFAULT CHARSET=utf8;
jsp页面:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
jsp页面:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="<%=path %>/static_resources/css/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="<%=path %>/static_resources/javascript/jquery/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="<%=path %>/static_resources/javascript/jquery.ztree.core-3.1.min.js"></script>
<script type="text/javascript">
var setting = {
async: {
contentType : "application/json",
enable : true,
dataType : "json",
type : "post",
url : "<%=path%>/getUserFunction",
dataFilter: null
},
data: {
simpleData: {
enable: true,
idKey: "id",
pIdKey: "pId",
rootPId: 0 //根节点
}
}
};
$(function(){
$.fn.zTree.init($("#treeDemo"), setting);
});
</script>
<title>DTree Demo</title>
</head>
<body>
<ul id="treeDemo" class="ztree"></ul>
</body>
</html>
相关推荐
ztree树做的一个小项目,用的mysql数据库,里面有数据库脚本,部署启动就能OK,http://localhost:8080/ztree 访问路径
在给定的“Ztree生成树”主题中,我们可以深入探讨Ztree的核心功能、如何使用JSON数据生成树、以及在实际项目中的应用。 首先,Ztree的亮点在于其灵活性和可定制性。通过配置不同的参数和CSS样式,开发者可以调整树...
在“ztree.rar 树生成案例”中,我们可以深入学习如何利用 `zTree` 实现动态、交互式的树形界面。 `zTree` 具有以下主要特性: 1. **轻量级**:`zTree` 的源码体积小巧,易于引入项目,减少加载时间。 2. **高度可...
在提供的两个文件"struts+ztree+jquery动态生成树结构1.txt"和"struts+ztree+jquery动态生成树结构2.txt"中,很可能是分别展示了这两种方法的具体实现细节,包括Action的代码示例、前端的jQuery代码和ZTree的配置。...
6. **递归算法生成树**: - 为了组装树结构,我们可以用递归方法,将结果集中的每个记录作为根节点或子节点,依据`parent_id`查找其父节点。 - 每次递归调用,都会将当前节点添加到其父节点的子节点列表中,直到...
ZTree,一个基于JavaScript的树形控件,提供了丰富的功能,包括动态生成JSON,这对于构建交互式的、数据驱动的用户界面尤其有用。在这里,我们将深入探讨如何使用ZTree实现动态生成JSON以及相关的技术细节。 首先,...
在IT领域,特别是前端开发中,ZTree是一款广泛使用的JavaScript组件,它主要用于构建可操作的树形结构。本文将深入探讨如何使用ZTree实现左右两棵树之间的节点移动,包括节点的添加、删除以及同步更新的操作。 首先...
动态生成树技术在现代Web应用中广泛用于展示层次结构数据,如组织结构、文件系统或导航菜单等。这里我们关注的是使用jQuery-zTree插件在前端实现动态树,结合Struts2和Spring后端框架来从数据库获取并处理数据,以及...
在本项目中,ZTree被用于前端,以展示由后台数据库生成的树形数据。 接下来,Visual Studio 2010作为微软的旗舰级开发环境,支持.NET Framework 4.0,为开发者提供了全面的开发工具和框架支持。在本案例中,VS2010...
在Java项目中,我们通常会结合后台服务(如Spring MVC或Servlet)来动态生成Ztree的数据源,然后通过Ajax请求传递到前端进行渲染。 1. **Ztree的配置与使用**: Ztree的配置主要涉及JSON数据格式和HTML结构。你...
在这个“asp.net mvc4 ztree 连接数据库 动态生成菜单简单demo”中,我们将探讨如何利用ASP.NET MVC4的技术特性结合ZTree,一个流行的JavaScript树状视图插件,来动态生成菜单,同时连接到数据库获取数据。...
一个SSM写的权限管理系统,RBAC权限模型,zTree刷权限树,动态生成权限菜单
zTree是一个基于jQuery实现的树形组件,广泛应用于网页中动态生成树形结构的场景。它可以一次性静态生成树形结构,也可以通过Ajax异步加载数据动态生成。zTree提供了丰富的事件和操作接口,使得开发者可以轻松控制...
在描述中提到的“简单树形菜单”是指zTree能够快速生成具有层级关系的菜单结构,这对于网站或应用程序的导航系统特别有用。 "CheckBox"和"Radio"是zTree中两种重要的选择机制。CheckBox允许用户进行多选操作,用户...
标题中的“完整ajax生成树实例”指的是一个使用Ajax技术实现的动态树形结构展示系统,它允许用户在不刷新整个页面的情况下更新树形结构。这种技术可以提高用户体验,因为页面的其他部分不会受到操作的影响,只有树状...
在layui中,通常我们使用layui的`form`模块来处理表单元素,而ztree则负责生成树结构。以下是一个基本的示例: ```javascript layui.use(['form', 'element'], function () { var form = layui.form, $ = layui.$...
综合以上信息,"ztree二级树菜单"的实现涉及到前端的zTree库与后端的SSI框架的结合,以及Action和JSP的协同工作,以实现动态加载和交互操作。在hulian平台中,这样的设计可以提高用户对层级结构数据的管理和操作效率...
zTree是一款强大的树形插件,广泛应用于网页中展示层次结构数据,如组织结构、文件目录等。本文将详细介绍如何借助zTree实现这一功能,并深入探讨相关技术点。 首先,理解zTree的基本概念和使用方法是关键。zTree的...