基于jsTree的无限级树JSON数据的转换代码


Posted in Javascript onJuly 27, 2010

jstree 主页 :
http://www.jstree.com/

其中提供了一种从后台取数据渲染成树的形式:

$("#mytree").tree({ 
data : { 
type : "json", 
url : "${ctx}/user/power!list.do" 
} 
});

对于url中返回的值必须是它定义的json数据形式:
$("#demo2").tree({ 
data : { 
type : "json", 
json : [ 
{ attributes: { id : "pjson_1" }, state: "open", data: "Root node 1", children : [ 
{ attributes: { id : "pjson_2" }, data: { title : "Custom icon", icon : "../media/images/ok.png" } }, 
{ attributes: { id : "pjson_3" }, data: "Child node 2" }, 
{ attributes: { id : "pjson_4" }, data: "Some other child node" } 
]}, 
{ attributes: { id : "pjson_5" }, data: "Root node 2" } 
] 
} 
});

这里需要一个从后台实例集合转换为它规定的json数据的形式.
/** *//** 
* 无限递归获得jsTree的json字串 
* 
* @param parentId 
* 父权限id 
* @return 
*/ 
private String getJson(long parentId) 
{ 
// 把顶层的查出来 
List<Action> actions = actionManager.queryByParentId(parentId); 
for (int i = 0; i < actions.size(); i++) 
{ 
Action a = actions.get(i); 
// 有子节点 
if (a.getIshaschild() == 1) 
{ 
str += "{attributes:{id:\"" + a.getAnid() 
+ "\"},state:\"open\",data:\"" + a.getAnname() + "\" ,"; 
str += "children:["; 
// 查出它的子节点 
List<Action> list = actionManager.queryByParentId(a.getAnid()); 
// 遍历它的子节点 
for (int j = 0; j < list.size(); j++) 
{ 
Action ac = list.get(j); 
//还有子节点(递归调用) 
if (ac.getIshaschild() == 1) 
{ 
this.getJson(ac.getParentid()); 
} 
else 
{ str += "{attributes:{id:\"" + ac.getAnid() 
+ "\"},state:\"open\",data:\"" + ac.getAnname() 
+ "\" " + " }"; 
if (j < list.size() - 1) 
{ 
str += ","; 
} 
} 
} 
str += "]"; 
str += " }"; 
if (i < actions.size() - 1) 
{ 
str += ","; 
} 
} 
} 
return str; 
}

调用:
@org.apache.struts2.convention.annotation.Action(results = 
{ @Result(name = "success", location = "/main/user/action-list.jsp") }) 
public String list() 
{ 
String str = "["; 
// 从根开始 
str += this.getJson(0); 
str += "]"; 
this.renderJson(str); 
return null; 
}

其中Action是菜单类或权限类等的实体。
效果图:
基于jsTree的无限级树JSON数据的转换代码
Javascript 相关文章推荐
JavaScript DOM 学习第二章 编辑文本
Feb 19 Javascript
那些年,我还在学习jquery 学习笔记
Mar 05 Javascript
jQuery 联动日历实现代码
May 31 Javascript
jQuery中get和post方法传值测试及注意事项
Aug 08 Javascript
node作为中间服务层如何发送请求(发送请求的实现方法详解)
Jan 02 Javascript
vue中Npm run build 根据环境传递参数方法来打包不同域名
Mar 29 Javascript
详解如何解决vue开发请求数据跨域的问题(基于浏览器的配置解决)
Nov 12 Javascript
详解vue项目中使用token的身份验证的简单实践
Mar 08 Javascript
vue实现文字横向无缝走马灯组件效果的实例代码
Apr 09 Javascript
es6数组之扩展运算符操作实例分析
Apr 25 Javascript
LayUI+Shiro实现动态菜单并记住菜单收展的示例
May 06 Javascript
Vue3中toRef与toRefs的区别
Mar 24 Vue.js
XENON基于JSON变种
Jul 27 #Javascript
JS遮罩层效果 兼容ie firefox jQuery遮罩层
Jul 26 #Javascript
腾讯与新浪的通过IP地址获取当前地理位置(省份)的接口
Jul 26 #Javascript
基于Jquery的文字滚动跑马灯插件(一个页面多个滚动区)
Jul 26 #Javascript
JQuery的Validation插件中Remote验证的中文问题
Jul 26 #Javascript
基于JQuery的一句代码实现表格的简单筛选
Jul 26 #Javascript
jQuery getJSON 处理json数据的代码
Jul 26 #Javascript
You might like
ThinkPHP快速入门实例教程之数据分页
2014/07/01 PHP
PHP排序算法之归并排序(Merging Sort)实例详解
2018/04/21 PHP
Laravel ORM 数据model操作教程
2019/10/21 PHP
TP3.2框架分页相关实现方法分析
2020/06/03 PHP
JQuery 选项卡效果(JS与HTML的分离)
2010/04/01 Javascript
JQuery 常用方法和事件详细介绍
2013/04/18 Javascript
js实现遮罩层划出效果是生成div而不是显示
2014/07/29 Javascript
js实现防止被iframe的方法
2015/07/03 Javascript
js跨浏览器的事件侦听器和事件对象的使用方法
2015/12/17 Javascript
js阻止浏览器默认行为触发的通用方法(推荐)
2016/05/15 Javascript
jQuery遍历DOM的父级元素、子级元素和同级元素的方法总结
2016/07/07 Javascript
js 创建对象 经典模式全面了解
2016/08/16 Javascript
jQuery Checkbox 全选 反选的简单实例
2016/11/29 Javascript
Bootstrap基本插件学习笔记之Popover提示框(19)
2016/12/08 Javascript
Vue.js 踩坑记之双向绑定
2018/05/03 Javascript
npm scripts 使用指南详解
2018/10/08 Javascript
基于Taro的微信小程序模板消息-获取formId功能模块封装实践
2019/07/15 Javascript
vue项目如何监听localStorage或sessionStorage的变化
2021/01/04 Vue.js
Python使用pyautogui模块实现自动化鼠标和键盘操作示例
2018/09/04 Python
Selenium chrome配置代理Python版的方法
2018/11/29 Python
Python 实现Numpy中找出array中最大值所对应的行和列
2019/11/26 Python
使用Python给头像加上圣诞帽或圣诞老人小图标附源码
2019/12/25 Python
pytorch 利用lstm做mnist手写数字识别分类的实例
2020/01/10 Python
css3隔行变换色实现示例
2014/02/19 HTML / CSS
css3动画鼠标放上图片逐渐变大鼠标离开图片逐渐缩小效果
2021/01/27 HTML / CSS
HTML5单页面手势滑屏切换原理
2016/03/21 HTML / CSS
关于爱情的广播稿
2014/01/16 职场文书
个人党性剖析材料
2014/02/03 职场文书
爱护公共设施倡议书
2014/08/29 职场文书
2015年档案管理工作总结
2015/04/08 职场文书
老人与海读书笔记
2015/06/26 职场文书
医学生自荐信范文(2016精选篇)
2016/01/28 职场文书
python plt.plot bar 如何设置绘图尺寸大小
2021/06/01 Python
Python自动化爬取天眼查数据的实现
2021/06/15 Python
Ubuntu18.04下QT开发Android无法连接设备问题解决实现
2022/06/01 Java/Android
Win11使用CAD卡顿或者致命错误怎么办?Win11无法正常使用CAD的解决方法
2022/07/23 数码科技