论坛首页 Web前端技术论坛

基于jsTree(Jquery Plugin)的无限级树JSON数据的转换

浏览 27674 次
精华帖 (2) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2009-06-01   最后修改:2009-06-10
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 6.8日修改
	 * @return
	 */
	private String getJson(long parentId)
	{
		List<Authority> list = authorityManager.queryByParentId(parentId);
		for (int i = 0; i < list.size(); i++)
		{
			Authority au = list.get(i);
			if (au.getIshaschild() == 1)
			{
				str += "{attributes:{id:\"" + au.getAnid()
						+ "\"},state:\"open\",data:\"" + au.getAnname()
						+ "\" ,";
				str += "children:[";
				this.getJson(au.getAnid());
				str += "]";
				str += "   }";
			}
			else
			{
				str += "{attributes:{id:\"" + au.getAnid()
						+ "\"},state:\"open\",data:\"" + au.getAnname() + "\" "
						+ "   }";
			}
			if (i < list.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;
    }


  • 大小: 12.8 KB
   发表时间:2009-06-10  
bug 已修正.
0 请登录后投票
   发表时间:2009-07-22  
你好 用这个方法怎么运行不了呢?
0 请登录后投票
   发表时间:2009-07-22  
你好,请问jstree,能够支持局部装载吗?即点击某一个节点,这个时候请求服务器,然后生成该节点的子节点,再显示。
0 请登录后投票
   发表时间:2009-07-23  
可以.api里写着呢.
0 请登录后投票
   发表时间:2009-07-23  
恕我才疏学浅啊。api中没有找到相应的方法来处理。请指点。
0 请登录后投票
   发表时间:2009-07-24  
http://www.jstree.com/reference/_documentation/3_configuration.html

 data    : 
{        type    : "predefined", // ENUM [json, xml_flat, xml_nested, predefined]        method  : "GET",        // HOW TO REQUEST FILES        a
sync   : false,     
   // BOOL - async loading onopen        async_data : function (NODE) { return { id : $(NODE).attr("id") || 0 } }, // PARAMETERS PASSED TO SERVER        url     : false,        // FALSE or STRING - url to document to be used (async or not)        json    : false,        // FALSE or OBJECT if type is JSON and async is false - the tree dump as json        xml     : false         // FALSE or STRING    },


sync设置成true,然后设置async_data 异步数据.
doc上已经写得很清楚了.
0 请登录后投票
   发表时间:2009-08-08  
请问如何把这棵树修改后,保存下来呢?比如创建新节点,改名子后,重新保存到数据库中,谢谢!
0 请登录后投票
   发表时间:2009-09-02  
你封装Json数据的时候并没有定义str这个变量,难道不会出错吗
0 请登录后投票
   发表时间:2009-09-03  
wang363714266 写道
你封装Json数据的时候并没有定义str这个变量,难道不会出错吗

全局变量而已,没看出来那只是部分代码吗?
0 请登录后投票
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics