从数据库获取数据后，生成EasyUI树

最新推荐文章于 2021-03-26 06:43:35 发布

notail_woo

最新推荐文章于 2021-03-26 06:43:35 发布

阅读量1.8k

点赞数

文章标签： jQuery easyui tree

不用管是什么数据库，php还是java语言

只要数据库表字段是有自身指向的结构的都行。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="http://localhost:8080/MyOA/">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>MyOA</title>
<link rel="stylesheet" type="text/css" href="http://localhost:8080/MyOA/Public/easyUI/themes/bootstrap/easyui.css">
<link rel="stylesheet" type="text/css" href="http://localhost:8080/MyOA/Public/easyUI/themes/icon.css">
</head>
<body>
<ul id="tt" class="easyui-tree" data-options="data:menuData"></ul>
</body>
<script type="text/javascript" src="http://localhost:8080/MyOA/Public/js/jquery-2.0.0.min.js"></script>
<script type="text/javascript" src="http://localhost:8080/MyOA/Public/easyUI/jquery.easyui.min.js"></script>
<script type="text/javascript">
function makeEasyTree(data){
if(!data)
return [];
var _newData = []; //最终返回结果
var _treeArray = {}; //记录一级节点
var _root = 1; //最顶层fid
var _idKey = "id"; //主键的键名
var _fidKey = "fid"; //父ID的键名
_getChildren(_root);
function _getChildren($root){
var $children = [];
for (var i in data){
if($root == data[i][_fidKey]){
data[i]["children"] = _getChildren(data[i][_idKey]);
$children.push(data[i]);
}
//只要一级节点
if(_root == data[i][_fidKey] && !_treeArray[data[i][_idKey]]){
_treeArray[data[i][_idKey]] = data[i];
_newData.push(data[i]);
}
}
return $children;
}
return _newData;
}

var menuData = [{"id":"2","fid":"1","text":"系统设置","nodeUrl":"Admin"},{"id":"5","fid":"1","text":"笔记本","nodeUrl":"Admin"},{"id":"3","fid":"2","text":"系统角色管理","nodeUrl":"Admin&m=Sys&a=manageRole"},{"id":"4","fid":"2","text":"系统菜单管理","nodeUrl":"Admin&m=Sys&a=manageNode"},{"id":"8","fid":"2","text":"用户管理","nodeUrl":"Admin&m=Sys&a=manageUser"},{"id":"6","fid":"5","text":"笔记列表","nodeUrl":"Admin&m=LjbNote"},{"id":"7","fid":"5","text":"添加笔记","nodeUrl":"Admin&m=LjbNote&a=saveNote"},{"id":"9","fid":"5","text":"管理分类","nodeUrl":"Admin&m=LjbNote&a=manageType"},{"id":"10","fid":"5","text":"test","nodeUrl":""}];
menuData = makeEasyTree(menuData);
</script>
</html>

notail_woo

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
从数据库获取数据后，生成EasyUI树

不用管是什么数据库，php还是java语言只要数据库表字段是有自身指向的结构的都行。MyOAfunction makeEasyTree(data){if(!data)return [];var _newData = []; //最终返回结果var _treeArray = {}; //记录一级节点v
复制链接

扫一扫