easyui tree json php,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

}

}

]

5a27a3bc2d1a57fadb429830feff4b0e.png

如图①

正确的图是

ae6d1fb674a16dc8d3672bb1c57633c7.png

二、tree加载方式

1、html格式

  • Folder

    • Sub Folder 1

    • File 2

    • File 3

  • File21

2、加载json文件,如tree_data.json,内容如上

$('#tt').tree({

url:'tree_data.json'

});

3、从后台数据库传json字符串值

①实体类

56dacd378d13cd7f54e253c66bc01de9.png

②tree json格式对应的实体类

fd1f956f9d2dc824ca984f6cc341953a.png

③实体类Menu转化为TreeNode格式(tree 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 tree(Listnodes,Integer id) {

//递归转化为树形

List treeNodes=new ArrayList();

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());

Mapattributes=new HashMap();

attributes.put("url", menu.getUrl());

node.setAttributes(attributes);

return node;

}

public static ListtoListNode(List

Listnodes=new ArrayList();

for(Menu menu:menus){

nodes.add(toNode(menu));

}

return nodes;

}

}

④查询出需要的菜单记录,我这里是权限管理系统,一个角色对应多个菜单,通过角色id查询出菜单记录,一个用户有多个角色,所以多个角色对应的菜单可能有交集,这里采用rbac的白名单权限,获得最大的菜单权限。

@Override

public List

List

for(Integer roleId:roleIds){

List

for(Menu menu:menus1){

if(!menus.contains(menu)){

menus.add(menu);

}

}

}

return menus;

}

⑤controller层代码

@ResponseBody

@RequestMapping(value="treeView")

public List treeView(@RequestParam("roleIds")String roleIdStr){

String param[]=roleIdStr.split(",");

Integer[] roleIds=new Integer[param.length];

for(int i=0;i

roleIds[i]=Integer.parseInt(param[i]);

}

List

Listnodes=TreeNodeUtil.toListNode(menus);

ListtreeNodes=TreeNodeUtil.tree(nodes, 0);

for(TreeNode node:nodes){

System.out.println(node.getIconCls());

System.out.println(node.getPid());

}

return treeNodes;

}

结果:

2b5ac277bd2afdfc07fe2ab1658e4809.png

⑥数据库部分设计

50f8438958e7e38a10d2fe3c4f182f95.png

dd21d4a6d6bfd92b9069fea692755e14.png

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

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
easyui是一个基于jQuery的UI框架,提供了丰富的界面组件和交互效果,方便开发人员快速构建Web页面。而treeeasyui中的一个树状组件,用于展示层级关系的数据。 在使用easyui tree进行java开发时,我们首先需要引入easyui的相关依赖包,并在页面中引入相应的脚本和样式文件。然后,我们可以通过在页面中定义一个div容器,将tree组件渲染在页面上。 在java后台代码中,我们需要提供数据tree组件进行展示。一般来说,我们可以通过数据库查询、接口调用等方式获取数据,并将数据转换为json格式。然后,将json数据返回给前端页面,供tree组件使用。 接下来,我们需要在前端页面中初始化并配置tree组件。通过调用easyui提供的API,我们可以设置tree数据源、展开图标、折叠图标、节点点击事件等。可以根据具体需求对tree进行自定义配置,以满足我们的业务需求。 在页面渲染完成后,easyui tree组件会自动将数据渲染为树状结构,并提供相应的交互功能,比如展开收起节点、选中节点等。我们可以通过对tree组件的事件进行监听,实现特定操作,比如点击节点后加载子节点、在节点上右键弹出菜单等。 总之,通过使用easyui tree组件,结合java后台开发,我们可以方便地实现树形结构的展示和交互操作,提升用户体验,简化开发流程。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值