zTree生成动态树

最新推荐文章于 2021-10-13 15:12:55 发布

籍籍无名333

最新推荐文章于 2021-10-13 15:12:55 发布

阅读量157

点赞数

文章标签： jquery ztree

本文链接：https://blog.csdn.net/daydayup0658/article/details/84479661

版权

环境搭建：需要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"%>

String path = request.getContextPath();

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

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>

</body>

</html>

籍籍无名333

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
zTree生成动态树

环境搭建：需要jquery 1.4+，jquery.ztree.core-3.1.min.js，ztree自带的css文件和图片，并且css文件和图片文件夹要处于同一目录(很重要)，否则动态树无法正常显示。数据库的设计：CREATE TABLE `function` ( `id` int(4) NOT NULL AUTO_INCREMENT, ...
复制链接

扫一扫