最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

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

来源:动视网 责编:小采 时间:2020-11-27 20:54:19
文档

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

基于jsTree的无限级树JSON数据的转换代码_javascript技巧:jstree 主页 : http://www.jstree.com/ 其中提供了一种从后台取数据渲染成树的形式: 代码如下: $(#mytree).tree({ data : { type : json, url : ${ctx}/user/power!list.do } }); 对于url中返回的值必须是它定义的
推荐度:
导读基于jsTree的无限级树JSON数据的转换代码_javascript技巧:jstree 主页 : http://www.jstree.com/ 其中提供了一种从后台取数据渲染成树的形式: 代码如下: $(#mytree).tree({ data : { type : json, url : ${ctx}/user/power!list.do } }); 对于url中返回的值必须是它定义的


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 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 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技巧

基于jsTree的无限级树JSON数据的转换代码_javascript技巧:jstree 主页 : http://www.jstree.com/ 其中提供了一种从后台取数据渲染成树的形式: 代码如下: $(#mytree).tree({ data : { type : json, url : ${ctx}/user/power!list.do } }); 对于url中返回的值必须是它定义的
推荐度:
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top