easyui tree后台传json处理问题
一、tree json格式
[
{
"id": 1,
"text": "权限管理",
"iconCls": "icon-feed",
"checked": false,
"attributes": {
"url": "#123"
},
"children": [
{
"id": 2,
"text": "用户管理",
"iconCls": "icon-users",
"checked": false,
"attributes": {
"url": null
},
"state": null },
{
"id": 3,
"text": "角色管理",
"iconCls": "icon-users",
"checked": false,
"attributes": {
"url": null
},
"children": [
{
"id": 10,
"text": "角色管理1",
"iconCls": "icon-users",
"checked": false,
"attributes": {
"url": null
},
"state": null }
],
"state": null },
{
"id": 4,
"text": "菜单管理",
"iconCls": "icon-users",
"checked": false,
"attributes": {
"url": "#222"
},
"state": null,
"children":[]
//注意这里的state值设置很关键,若为父节点,state="open"|"close",若为叶子节点,只能为空
//否则出错,如图①
}
] },
{
"id": 5,
"text": "系统模块",
"iconCls": "icon-feed",
"checked": false,
"attributes": {
"url": null
},
"state": null
},
{
"id": 6,
"text": "系统模块2",
"iconCls": "icon-feed",
"checked": false,
"attributes": {
"url": null
} },
{
"id": 7,
"text": "系统模块3",
"iconCls": "icon-feed",
"checked": false,
"attributes": {
"url": null
} },
{
"id": 8,
"text": "系统模块4",
"iconCls": "icon-feed",
"checked": false,
"attributes": {
"url": null
} },
{
"id": 9,
"text": "系统模块5",
"iconCls": "icon-feed",
"checked": false,
"attributes": {
"url": null
} }
]

如图①
正确的图是

二、tree加载方式
1、html格式
<ul id="tt" class="easyui-tree">
<li>
<span>Folder</span>
<ul>
<li>
<span>Sub Folder 1</span>
<ul>
<li>
<span><a href="#">File 11</a></span>
</li>
<li>
<span>File 12</span>
</li>
<li>
<span>File 13</span>
</li>
</ul>
</li>
<li>
<span>File 2</span>
</li>
<li>
<span>File 3</span>
</li>
</ul>
</li>
<li>
<span>File21</span>
</li>
</ul>
2、加载json文件,如tree_data.json,内容如上
<ul id="tt"></ul>
$('#tt').tree({
url:'tree_data.json'
});


import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import sys.entity.Menu;
public class TreeNodeUtil {
public static List<TreeNode> tree(List<TreeNode>nodes,Integer id) {
//递归转化为树形
List<TreeNode> treeNodes=new ArrayList<TreeNode>();
for(TreeNode treeNode : nodes) {
TreeNode node=new TreeNode();
node.setId(treeNode.getId());
node.setText(treeNode.getText());
node.setAttributes(treeNode.getAttributes());
node.setIconCls(treeNode.getIconCls());
node.setState(treeNode.getState());
node.setPid(treeNode.getPid());
if(id==treeNode.getPid()){
node.setChildren(tree(nodes, node.getId()));
treeNodes.add(node);
} }
return treeNodes;
}
//转化为TreeNode节点
public static TreeNode toNode(Menu menu){
TreeNode node=new TreeNode();
node.setId(menu.getId());
node.setIconCls(menu.getIcon());
node.setPid(menu.getParentMenuId());
System.out.println(node.getPid());
node.setText(menu.getMenuName());
node.setState(menu.getState());
Map<String,Object>attributes=new HashMap<String,Object>();
attributes.put("url", menu.getUrl());
node.setAttributes(attributes);
return node;
}
public static List<TreeNode>toListNode(List<Menu>menus){
List<TreeNode>nodes=new ArrayList<TreeNode>();
for(Menu menu:menus){
nodes.add(toNode(menu));
}
return nodes;
}
}
④查询出需要的菜单记录,我这里是权限管理系统,一个角色对应多个菜单,通过角色id查询出菜单记录,一个用户有多个角色,所以多个角色对应的菜单可能有交集,这里采用rbac的白名单权限,获得最大的菜单权限。
@Override
public List<Menu> getMenuByRoleId(Integer[] roleIds) {
List<Menu>menus=new ArrayList<Menu>();
for(Integer roleId:roleIds){
List<Menu>menus1=menuMapper.selectByRoleId(roleId);
for(Menu menu:menus1){
if(!menus.contains(menu)){
menus.add(menu);
}
}
}
return menus;
}
⑤controller层代码
@ResponseBody
@RequestMapping(value="treeView")
public List<TreeNode> treeView(@RequestParam("roleIds")String roleIdStr){
String param[]=roleIdStr.split(",");
Integer[] roleIds=new Integer[param.length];
for(int i=0;i<param.length;i++){
roleIds[i]=Integer.parseInt(param[i]);
}
List<Menu>menus=menuService.getMenuByRoleId(roleIds);
List<TreeNode>nodes=TreeNodeUtil.toListNode(menus);
List<TreeNode>treeNodes=TreeNodeUtil.tree(nodes, 0);
for(TreeNode node:nodes){
System.out.println(node.getIconCls());
System.out.println(node.getPid());
}
return treeNodes;
}
结果:

⑥数据库部分设计


easyui tree后台传json处理问题的更多相关文章
- ajax往后台传json格式数据报415错误
问题描述: ajax往后台传json格式数据报415错误,如下图所示 页面代码 function saveUser(){ var uuId = document.getElementById(&quo ...
- 前台给后台传JSON字符串,后台解析并保存
前台 function BMSure() { var DanWeiName = $("[id$='BusinessName']").val(); var Address = $(& ...
- 后台给前台传JSON字符串,前台解析并拼接显示
后台传JSON public class CourseType : IHttpHandler { Epoint.PeiXun.Bizlogic.BLL.CourseLibrary.PX_CourseT ...
- 从数据库读取数据并动态生成easyui tree构结
一. 数据库表结构 二.从后台读取数据库生成easyui tree结构的树 1.TreeNode树结点类(每个结点都包含easyui tree 的基本属性信息) import java.io.Seri ...
- .Net Mvc 返回Json,动态生成EasyUI Tree
最近做一个项目,开始接触EasyUI,感觉很强大,很适合我这种对前台不是很感冒的人.在学习Tree的过程中,感觉网上的资料挺乱的,很多只是把EasyUI API 抄了一遍.现在把最近这段时间的学到的, ...
- [转]easyui tree 模仿ztree 使用扁平化加载json
原文地址:http://my.oschina.net/acitiviti/blog/349377 参考文章:http://www.jeasyuicn.com/demo/treeloadfilter.h ...
- 解决ajax的parsererror错误的终极办法(后台传给前台的数据json问题)
解决ajax的parsererror错误的终极办法(后台传给前台的数据json问题) 出现这个问题的原因是因为后台传给前台的数据出现了问题,ajax对于json的格式特别的严格 下面是会出现这个问题的 ...
- Echart实现多个y轴,坐标轴的个数及名称由后台传过来的json数据决定。
yAxis: function(){ var yAxis=[]; for(var i=0;i<legend1.length;i++){ var item={ name:legend1[i], t ...
- 前台的js对象数组传到后台处理。在前台把js对象数组转化为json字符串,在后台把json字符串解析为List<>
前台的js对象数组传到后台处理.在前台把js对象数组转化为json字符串,在后台把json字符串解析为List<>
随机推荐
- 图片拉伸:IOS开发UIImage中stretchableImageWithLeftCapWidth
意思就是用来创建一个内容可拉伸,而边角不拉伸的图片,需要两个参数,第一个是左边不拉伸区域的宽度,第二个参数是上面不拉伸的高度.那么接下来的一个像素会被拉伸.例如,leftCapHeight为6,top ...
- array=nil 和 Array=[[NSMutableArray alloc]init]; 的区别
情况1: array=nil; [_PayArray addObject:BillDetail]; 此时array还是nil:因为array没有分配地址应该. 情况2: Array=[[NSMutab ...
- PCI的imagework已由freeview软件代替
作者:朱金灿 来源:http://blog.csdn.net/clever101 在PCI 9.1中重要模块集成显示环境imagework还存在,但是到了PCI 10.0中imagework已经消失了 ...
- react里执行shouldComponentUpdate时返回false的后果
大家都知道生命周期shouldComponentUpdate返回false时,不会进行后续的渲染,那这个时候state是什么情况呢.我们看一下demo class Toggle extends Rea ...
- PAT 1041-1050 题解
浏览全部代码:请戳 本文谨代表个人思路,欢迎讨论;) 1041. Be Unique (20) 题意 给出 N (<=105)个数(数值范围为 [1, 104]),找到其中不重复的第一个数字.比 ...
- UnitOfWork
数据访问层之UnitOfWork 接上文 项目架构开发:数据访问层之IQuery 本章我们继续IUnitOfWork的开发,从之前的IRepository接口中就可以看出,我们并没有处理单元事务, ...
- Spring 的 ApplicationEvent and ApplicationListener
什么是ApplicationContext? 它是Spring的核心,Context我们通常解释为上下文环境,可是理解成容器会更好些. ApplicationContext则是应用的容器. Sprin ...
- HDOJ 4901 The Romantic Hero
DP....扫两次合并 The Romantic Hero Time Limit: 6000/3000 MS (Java/Others) Memory Limit: 131072/131072 ...
- hadoop2.4.1的ftpserver建立
对于公司框架hadoop+hive,hive通过建立外部表(EXTERNAL TABLE)可以直接识别hdfs档,直接那假说本地文件hdfs文件系统.hive. 这期间须要一个ftp软件,能够沟通本地 ...
- WPF 3D 模型旋转
原文:WPF 3D 模型旋转 WPF 是 Microsoft 在 Framework3.0 中支持的一种技术,它能作出很绚丽的界面,同时它也支持3D的操作.在3D操作主要包括平移(Translate) ...