环境搭建：需要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结构。你...
在描述中提到的“简单树形菜单”是指zTree能够快速生成具有层级关系的菜单结构，这对于网站或应用程序的导航系统特别有用。 "CheckBox"和"Radio"是zTree中两种重要的选择机制。CheckBox允许用户进行多选操作，用户...
在这个“asp.net mvc4 ztree 连接数据库 动态生成菜单简单demo”中，我们将探讨如何利用ASP.NET MVC4的技术特性结合ZTree，一个流行的JavaScript树状视图插件，来动态生成菜单，同时连接到数据库获取数据。...
zTree是一个基于jQuery实现的树形组件，广泛应用于网页中动态生成树形结构的场景。它可以一次性静态生成树形结构，也可以通过Ajax异步加载数据动态生成。zTree提供了丰富的事件和操作接口，使得开发者可以轻松控制...
标题中的“完整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的...
它通过DOM操作和事件处理来实现树节点的动态生成和交互。源码中的注释对于理解zTree的工作原理和自定义行为非常有帮助。 zTree的配置选项丰富，可以根据需求定制。例如，`setting`对象包含了zTree的全局配置，如...