`

jstree

阅读更多

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;
	}



调用:

Java代码 复制代码
  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.     }  
分享到:
评论

相关推荐

    jsTree中文文档

    **jsTree 中文文档概述** jsTree 是一个流行的JavaScript库,用于在网页上创建交互式的树状视图。它主要用于组织结构化的数据,如文件系统、数据库目录或自定义项目结构。jsTree 支持多种操作,包括点击、拖放、...

    jsTree中文api

    **jsTree API详解** jsTree 是一个流行的JavaScript库,用于创建、操作和展示交互式的HTML树状视图。它提供了一套丰富的API,使得开发者能够方便地实现树形结构的各种功能,如添加、删除、修改节点,以及节点的移动...

    使用jsTree实现js树形结构

    **jsTree:构建前端树形结构的利器** jsTree 是一个强大的 JavaScript 库,专用于在 Web 页面上创建交互式的树形结构。它基于纯 JavaScript 编写,无需依赖其他库,因此对于初学者和有经验的开发者来说,都是一个...

    jsTree.v.1.0中文文档

    **jsTree.v.1.0中文文档** jsTree是一款基于JavaScript的开源库,主要用于创建、操作和展示HTML页面上的树状结构。它适用于构建复杂的交互式界面,如文件管理系统、组织架构图、导航菜单等。jsTree v.1.0是该库的一...

    jsTree 很好用的动态加载数

    **jsTree 概述** jsTree 是一个基于 JavaScript 的开源库,专为创建交互式的树状视图而设计。它提供了丰富的功能,如动态加载、增删节点、拖放操作等,使得在网页中实现复杂的数据结构展示变得简单。jsTree 支持...

    JsTree 最详细教程及完整实例

    **JsTree 全面解析与实战指南** JsTree 是一个基于 JavaScript 的开源库,用于创建交互式的树形数据结构。这个强大的工具适用于多种用途,包括文件管理、菜单系统、数据可视化等。它提供了丰富的功能,如多选、拖放...

    JSTree(js写的树形菜单,支持加载10000节点以上)

    **JSTree:高效处理大数据量的JavaScript树形菜单组件** 在Web开发中,树形菜单是一种常见的数据展示形式,用于组织和展示层次结构的数据。JSTree是一款基于JavaScript的开源库,专为构建功能丰富的交互式树形菜单...

    jstree.min.js.zip

    **jstree.min.js** 是一个基于 jQuery 的交互式树形视图插件,它允许在网页中创建和管理结构化的目录或数据展示。这款插件以其轻量级、高度可定制和易于使用的特性而受到开发者们的欢迎。下面将详细介绍 jstree 的...

    手机端js tree

    在移动设备上,为了有效地展示层次结构数据,如文件系统、组织架构或导航菜单,"手机端js tree"成为了一种实用的解决方案。这个技术基于JavaScript,专为智能手机和平板电脑等移动端设备设计,提供了可自定义的树形...

    jstree目录树控件

    **jsTree:构建交互式目录树的利器** jsTree是一款完全用JavaScript编写的开源库,专为实现跨浏览器的树状视图而设计。它在Web应用中扮演着目录树控件的角色,允许用户以树形结构展示数据,极大地提高了用户体验。...

    jsTree大集合

    **jsTree大集合** jsTree是一款强大的JavaScript库,专门用于创建、操作和展示HTML页面中的树状结构。这个“jsTree大集合”很可能是包含了一系列关于jsTree的资源、示例代码、文档以及可能的插件集合,为开发者提供...

    jsTree JAVA例子

    **jsTree 与 Java 整合详解** jsTree 是一个流行的 JavaScript 库,用于创建交互式的树状视图。它提供了丰富的功能,如节点的拖放、搜索、上下文菜单等,广泛应用于网站的导航菜单、文件管理器、数据结构展示等领域...

    jstree中文文档.doc

    jstree是一个流行的JavaScript库,专门用于在前端创建交互式的树形结构。它适用于构建诸如文件浏览器、组织架构图或层级菜单等应用。这个中文文档详细介绍了jstree的核心功能和API,使得开发者能更容易地理解和使用...

    jsTree动态tree

    **jsTree动态tree详解** jsTree是一款基于JavaScript的开源库,专门用于构建交互式的树形视图。在网页开发中,树形结构常用于展示层级关系的数据,如目录、组织结构或导航菜单等。jsTree提供了丰富的API和可定制的...

    jsTree 大集合

    **jsTree 大集合** jsTree 是一个流行的 JavaScript 库,专门用于在 Web 应用程序中创建交互式树形视图。它提供了一个强大的工具集,帮助开发者构建功能丰富的数据展示和操作界面,适用于组织结构、文件系统、菜单...

    JsTree静态例子

    **JsTree静态例子详解** JsTree是一款基于JavaScript的开源库,专门用于创建、操作和展示树状数据结构。它在Web应用中广泛用于构建可交互的目录结构、文件管理系统或者组织复杂的分类信息。本篇文章将深入探讨如何...

    JsTree 实例使用

    **JsTree 实例使用详解** JsTree 是一个强大的JavaScript库,专为构建交互式的树状视图而设计。它在Web开发中广泛应用于文件管理、菜单系统、组织结构展示等多种场景。JsTree 提供了丰富的功能,如动态加载、节点...

    jsTree树形菜单

    **jsTree:JavaScript实现的树形菜单** jsTree是一款基于JavaScript的开源库,专门用于创建交互式的树形菜单。它提供了丰富的功能和多种定制选项,适用于网页中的数据组织和展示,如导航菜单、文件系统视图或者数据...

    JStree(最全)

    **JStree 全面解析** JStree 是一个基于 JavaScript 的开源库,专用于创建交互式的树形数据结构。这个强大的工具支持多种操作,包括拖放、搜索、多选、加载异步数据(AJAX)等,广泛应用于网页中的菜单、文件浏览器...

    jsTree操作 jsTree插件简介

    **jsTree 操作详解** jsTree 是一个基于 jQuery 的开源 JavaScript 库,用于创建交互式的树状视图。它提供了一种优雅的方式来呈现和操作数据结构,尤其适用于构建树形菜单或目录。jsTree 支持多种功能,包括动态...

Global site tag (gtag.js) - Google Analytics