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是菜单类或权限类等的实体。
更多优质资料尽在百考试题论坛 百考试题在线题库 java认证更多详细资料
分享到:
相关推荐
**jsTree:构建前端树形结构的利器** jsTree 是一个强大的 JavaScript 库,专用于在 Web 页面上创建交互式的树形结构。它基于纯 JavaScript 编写,无需依赖其他库,因此对于初学者和有经验的开发者来说,都是一个...
**jsTree:构建交互式目录树的利器** jsTree是一款完全用JavaScript编写的开源库,专为实现跨浏览器的树状视图而设计。它在Web应用中扮演着目录树控件的角色,允许用户以树形结构展示数据,极大地提高了用户体验。...
**JSTree:高效处理大数据量的JavaScript树形菜单组件** 在Web开发中,树形菜单是一种常见的数据展示形式,用于组织和展示层次结构的数据。JSTree是一款基于JavaScript的开源库,专为构建功能丰富的交互式树形菜单...
**jsTree:JavaScript实现的树形菜单** jsTree是一款基于JavaScript的开源库,专门用于创建交互式的树形菜单。它提供了丰富的功能和多种定制选项,适用于网页中的数据组织和展示,如导航菜单、文件系统视图或者数据...
初始化一个jsTree实例,你需要指定一个DOM元素作为树的容器,并提供配置对象来定制行为和外观: ```javascript $('#jstree_demo_div').jstree({ 'core': { 'data': [ { "text": "节点1", "children": [ { "text...
在“jsTree 左侧导航树大集合”中,我们可以期待看到一系列关于如何构建和应用jsTree来实现左侧导航功能的示例。 **窗体导航控件** 在Web开发中,窗体导航控件是用户界面的关键组成部分,它们帮助用户在多个页面或...
总结来说,jsTree提供了全面的API来处理树形数据,无论是在基本的操作,如添加、删除和移动节点,还是更复杂的事件处理和动态加载数据,都具有灵活的接口。结合jsTree的中文API文档,开发者可以轻松地在项目中集成和...
1. HTML和CSS:在移动端,js Tree通常使用HTML5的`<ul>`和`<li>`元素来构建树形结构。CSS用于布局和样式调整,确保在不同尺寸的屏幕上看起来清晰、易于阅读。 2. JavaScript:js Tree的核心是JavaScript代码,它...
2. **无限深度扩展**:`jstree`支持无限级别的子节点,这意味着可以构建一个无限制深度的树结构。这对于表示层级复杂的数据,如文件系统、组织架构或者分类目录等非常适用。开发者可以通过动态加载数据或者一次性...
**jsTree:基于jQuery的超强大树形控件** jsTree是一款高度可定制的JavaScript库,专注于构建交互式的树形结构。它完全基于jQuery,因此能够无缝地融入任何已使用jQuery的项目中,同时支持所有主流浏览器,包括...
- **API方法**:如`jstree('select_node')`选择节点,`jstree('rename_node')`重命名节点,`jstree('get_json')`获取当前树的JSON表示。 - **事件**:jsTree提供了丰富的事件,如`select_node.jstree`在节点被选中...
JsTree 是一个基于 JavaScript 的开源库,用于创建交互式的树形数据结构。这个强大的工具适用于多种用途,包括文件管理、菜单系统、数据可视化等。它提供了丰富的功能,如多选、拖放、搜索、加载异步数据等,同时...
同时,jsTree 还有一套丰富的事件系统,如 `create_node.jstree`、`delete_node.jstree` 等,你可以绑定事件处理器来响应用户的操作或树的变化。 **版本信息** 提供的压缩包文件名为 `jsTree.v.0.9.9a`,这表明它...
JS Tree 是一个基于JavaScript的库,专门用于在Web页面上创建交互式的目录树结构,这种结构类似于Windows操作系统中的文件夹树,能够帮助用户以层级方式浏览和操作数据。 目录树在Web应用中有很多用途,例如: 1. ...
**jsTree:强大的jQuery树形控件** **一、jsTree基本介绍** jsTree是一款功能丰富的JavaScript库,专为在Web应用中实现交互式的树形结构而设计。它基于流行的jQuery框架,允许开发者轻松地在网页上创建和管理树形...
JStree 是一个基于 JavaScript 的开源库,专用于创建交互式的树形数据结构。这个强大的工具支持多种操作,包括拖放、搜索、多选、加载异步数据(AJAX)等,广泛应用于网页中的菜单、文件浏览器、组织结构展示等场景...
除了基本的树结构操作,jsTree 还可以与其他页面元素结合,实现更复杂的功能。例如,可以将树形结构的节点与表单关联,用节点作为键,表单作为值,创建强大的数据管理界面。 jsTree 的灵活性和丰富的功能使其成为 ...
**基于jQuery的树形结构JsTree使用心得** JsTree是一款基于JavaScript的开源库,它能够帮助开发者轻松地在网页上创建交互式的树形结构。在本文中,我们将深入探讨如何利用jQuery与JsTree来构建这样的功能,同时分享...