基于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 相关文章推荐
JS Timing
Apr 21 Javascript
input+select(multiple) 实现下拉框输入值
May 21 Javascript
JS 自动完成 AutoComplete(Ajax 查询)
Jul 07 Javascript
js或css文件后面跟参数的原因说明
Jan 09 Javascript
Javascript 中的 call 和 apply使用介绍
Feb 22 Javascript
JS实现随机化快速排序的实例代码
Aug 01 Javascript
table行随鼠标移动变色示例
May 07 Javascript
JQuery中两个ul标签的li互相移动实现方法
May 18 Javascript
jQuery中prepend()方法使用详解
Aug 11 Javascript
关于JavaScript作用域你想知道的一切
Feb 04 Javascript
jQuery+CSS实现简单切换菜单示例
Jul 27 Javascript
使用vant的地域控件追加全部选项
Nov 03 Javascript
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
《超神学院》霸气归来, 天使彦上演维多利亚的秘密
2020/03/02 国漫
PHP在字符串中查找指定字符串并删除的代码
2008/10/02 PHP
php实现批量下载百度云盘文件例子分享
2014/04/10 PHP
PHP内存缓存功能memcached示例
2016/10/19 PHP
laravel创建类似ThinPHP中functions.php的全局函数
2016/11/26 PHP
PHP利用pdo_odbc实现连接数据库示例【基于ThinkPHP5.1搭建的项目】
2019/05/13 PHP
判断页面是关闭还是刷新的js代码
2007/01/28 Javascript
070823更新的一个[消息提示框]组件 兼容ie7
2007/08/29 Javascript
从零开始学习jQuery (八) 插播:jQuery实施方案
2011/02/23 Javascript
JS图片无缝、平滑滚动代码
2014/03/11 Javascript
JS实现图片的不间断连续滚动的简单实例
2016/06/03 Javascript
很实用的js选项卡切换效果
2016/08/12 Javascript
js基础之DOM中元素对象的属性方法详解
2016/10/28 Javascript
JavaScript基于自定义函数判断变量类型的实现方法
2016/11/23 Javascript
Node.js中文件操作模块File System的详细介绍
2017/01/05 Javascript
详解vue2.0 transition 多个元素嵌套使用过渡
2017/06/19 Javascript
常见的浏览器Hack技巧整理
2017/06/29 Javascript
深入剖析Express cookie-parser中间件实现示例
2018/02/01 Javascript
JavaScript设计模式之职责链模式应用示例
2018/08/07 Javascript
vue中的mvvm模式讲解
2019/01/31 Javascript
微信小程序实现单选选项卡切换效果
2020/06/19 Javascript
Python+selenium 获取一组元素属性值的实例
2018/06/22 Python
六行python代码的爱心曲线详解
2019/05/17 Python
Django框架教程之中间件MiddleWare浅析
2019/12/29 Python
pycharm如何实现跨目录调用文件
2020/02/28 Python
html5 touch事件实现触屏页面上下滑动(二)
2016/03/10 HTML / CSS
HTML5中外部浏览器唤起微信分享
2020/01/02 HTML / CSS
唤醒头发毛囊的秘密武器:Grow Gorgeous
2016/08/28 全球购物
英国标准协会商店:BSI Shop
2019/02/25 全球购物
教师求职推荐信范文
2013/11/20 职场文书
关爱留守儿童标语
2014/06/18 职场文书
小学教育见习报告
2014/10/31 职场文书
廉洁自律证明
2015/06/24 职场文书
团队合作精神学习心得体会
2016/01/19 职场文书
小学教代会开幕词
2016/03/04 职场文书
Html5通过数据流方式播放视频的实现
2021/04/27 HTML / CSS