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

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

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

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


对于url中返回的值必须是它定义的json数据形式:

  1. $("#demo2").tree({  
  2.   data  : {  
  3.     type  : "json",  
  4.     json  : [   
  5.       { attributes: { id : "pjson_1" }, state: "open", data: "Root node 1", children : [  
  6.         { attributes: { id : "pjson_2" }, data: { title : "Custom icon", icon : "../media/images/ok.png" } },  
  7.         { attributes: { id : "pjson_3" }, data: "Child node 2" },  
  8.         { attributes: { id : "pjson_4" }, data: "Some other child node" }  
  9.       ]},   
  10.       { attributes: { id : "pjson_5" }, data: "Root node 2" }   
  11.     ]  
  12.   }  
  13. });  
$("#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数据的形式.

  1. /**  
  2.      * 无限递归获得jsTree的json字串  
  3.      *   
  4.      * @param parentId  
  5.      *            父权限id  
  6.      * @return  
  7.      */  
  8.     private String getJson(long parentId)  
  9.     {  
  10.         // 把顶层的查出来  
  11.         List<Action> actions = actionManager.queryByParentId(parentId);  
  12.         for (int i = 0; i < actions.size(); i++)  
  13.         {  
  14.             Action a = actions.get(i);  
  15.             // 有子节点  
  16.             if (a.getIshaschild() == 1)  
  17.             {  
  18.                 str += "{attributes:{id:\"" + a.getAnid()  
  19.                         + "\"},state:\"open\",data:\"" + a.getAnname() + "\" ,";  
  20.                 str += "children:[";  
  21.                 // 查出它的子节点  
  22.                 List<Action> list = actionManager.queryByParentId(a.getAnid());  
  23.                 // 遍历它的子节点  
  24.                 for (int j = 0; j < list.size(); j++)  
  25.                 {  
  26.                     Action ac = list.get(j);  
  27.                     //还有子节点(递归调用)  
  28.                     if (ac.getIshaschild() == 1)  
  29.                     {  
  30.                         this.getJson(ac.getParentid());  
  31.                     }  
  32.                     else  
  33.                     {  
  34.   
  35.                         str += "{attributes:{id:\"" + ac.getAnid()  
  36.                                 + "\"},state:\"open\",data:\"" + ac.getAnname()  
  37.                                 + "\" " + "   }";  
  38.                         if (j < list.size() - 1)  
  39.                         {  
  40.                             str += ",";  
  41.                         }  
  42.                     }  
  43.                 }  
  44.                 str += "]";  
  45.                 str += "   }";  
  46.                 if (i < actions.size() - 1)  
  47.                 {  
  48.                     str += ",";  
  49.                 }  
  50.             }  
  51.         }  
  52.         return str;  
  53.     }  
/**
     * 无限递归获得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;
    }


调用:

  1. @org.apache.struts2.convention.annotation.Action(results =  
  2.     { @Result(name = "success", location = "/main/user/action-list.jsp") })  
  3.     public String list()  
  4.     {  
  5.         String str = "[";  
  6.         // 从根开始   
  7.         str += this.getJson(0);  
  8.         str += "]";  
  9.         this.renderJson(str);  
  10.         return null;  
  11.     }  
@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是菜单类或权限类等的实体。
效果图:

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值