ExtJS4.2 根据数据库记录构建树形菜单
背景:最近用ExtJS4.2做一个系统,需要在前端展示资源菜单,为树形结构,该树形结构是从数据库动态加载的。
ExtJS的树形结构大致有两种情况:
1.静态树形结构,此处不多说,看API就能简单明白;
2.动态加载,ExtJS的特性是根据父节点ID来查询子节点,从而动态更新树形菜单,这里有一个缺陷,或许是我孤陋寡闻不知道,那就是无法根据数据库节点信息自动构建成为一棵树,记得zTree插件就有这个功能。
那么,我希望能够根据数据库树节点信息自动的构建成一棵树,就需要自己去写个小算法在后台拼接成ExtJS需要的数据结构。
代码部分:
1.节点pojo,必要属性有:节点ID(id)、父节点ID(parentId)、文本信息(text)、孩子(children),其他属性,比如节点url,顺序order等根据自己需要设置。
public class Resource {
private Integer id;
private String text;
private Integer parentId;
private Boolean expanded;
private List<Resource> children = new ArrayList<Resource>();
}
2.根据查询出来的节点List集合拼装成为前端展示需要的结构,这里写了个静态方法。
public static final <T> List<T> buildTree(List<T> nodes) {
if(null == nodes || nodes.size() == 0) return null; Map<Integer, T> resources = new HashMap<Integer, T>();
List<T> result = new ArrayList<T>(); try {
for(int i=0; i<nodes.size(); i++) {
T node = nodes.get(i);
Method getId = node.getClass().getMethod("getId");
Integer id = (Integer) getId.invoke(node);
resources.put(id, node);
} for (Map.Entry<Integer, T> e : resources.entrySet()) {
T node = e.getValue();
Method getparentId = node.getClass().getMethod("getParentId");
Integer parentId = (Integer) getparentId.invoke(node);
if(parentId == 0) {
result.add(node);
} else {
T parent = resources.get(parentId);
if( null != parent) {
@SuppressWarnings("unchecked")
List<T> children = (List<T>) parent.getClass().getMethod("getChildren").invoke(parent);
children.add(node);
}
}
}
} catch (Exception e) {
e.printStackTrace();
}
return result;
}
3.数据库记录。
4.ExtJS前端代码。
Ext.onReady(function() {
var store = Ext.create('Ext.data.TreeStore', {
proxy: {
type: 'ajax',
url: 'your url'
},
root: {
text: '系统菜单',
id: 0,
expanded: true
}
});
var treePanel = Ext.create('Ext.tree.Panel', {
title: '树形菜单',
width: 300,
height: 350,
margin: '50 0 0 500',
store: store,
rootVisible: false,
useArrows: true,
renderTo: Ext.getBody()
});
});
5.效果图。
6.完毕。
ExtJS4.2 根据数据库记录构建树形菜单的更多相关文章
- java构建树形菜单递归工具类
1.设计菜单实体 import java.util.List; public class Menu { //菜单id private Long id; //父节点id private Long par ...
- 使用zTree插件构建树形菜单
zTree下载:https://github.com/zTree/zTree_v3 目录: 就我看来,zTree较为实用的有以下几点: zTree 是一个依靠 jQuery 实现的多功能 “树插件”. ...
- Java从数据库读取页面树形菜单
从数据库加载菜单及子菜单主要使用递归的方法,具体实现可看代码 首先封装一个菜单pojo public class Menu { // 菜单id private String id; // 菜单名称 p ...
- 构建简单的json树形菜单
json结构: var Menu = [{ tit:"一级菜单", submenu:[{ tit:"二级菜单", url:"", func: ...
- jQuery树形菜单(1)jquery.treeview
jQuery的树形插件资料URL:http://bassistance.de/jquery-plugins/jquery-plugin-treeview/从该网站Download得到jquery.tr ...
- ExtJS4 根据分配不同的树形菜单在不同的角色登录后
继续我的最后.建立cookie后,带他们出去 var userName = Ext.util.Cookies.get('userName'); var userAuthority = Ext.util ...
- 用Vue.js递归组件构建一个可折叠的树形菜单
在Vue.js中一个递归组件调用的是其本身,如: Vue.component('recursive-component', { template: `<!--Invoking myself! ...
- EasyUI创建异步树形菜单和动态添加标签页tab
创建异步树形菜单 创建树形菜单的ul标签 <ul class="easyui-tree" id="treeMenu"> </ul> 写j ...
- ERP存储过程的调用和树形菜单的加载(四)
引用:DAL:System.Data.SqlClient;System.Data; namespace CommTool { public class SqlComm { /// <summar ...
随机推荐
- Linux信号处理
给进程设置僵尸状态的目的是维护子进程的信息,以便父进程在以后某个时间获取.这些信息包括子进程的进程ID.终止状态以及资源利用信息(CPU时间,内存使用量等等).如果一个进程终止,而该进程有子进程处于僵 ...
- yum报错: Error: Cannot retrieve metalink for repository: epel. Please verify its path and try again
在Centos 5.x或6.x上安装RHEL EPEL Repo repository,资源库,源的意思.RHEL EPEL(Extra Packages for Enterprise Linux) ...
- 第三篇 SQL Server安全主体和安全对象
本篇文章是SQL Server安全系列的第三篇,详细内容请参考原文. 一般来说,你通过给主体分配对象的权限来实现SQL Server上的用户与对象的安全.在这一系列,你会学习在SQL Server实例 ...
- JQuery获取页面关闭事件
<script type="text/javascript" language="javascript"> $(window).unload(fun ...
- Mysql 5.7.7
1.安装Mysql(需要管理员权限) 2.启动Mysql 3.连接Mysql Mysql刚安装成功后可输入 mysql -u root -p ,然后回车,提示输入密码,由于是第一次连接,不用输入密码也 ...
- SQL Server中的uniqueidentifier类型
uniqueidentifier类型可以配合T-SQL中的newid和newsequentialid来生成唯一标识符,具体区别如下(摘抄自微软官方文档). Nonsequential GUIDs: Y ...
- 异常积累:org.hibernate.StaleStateException
ERROR - Exception executing batch: org.hibernate.StaleStateException: Batch update returned unexpec ...
- PostgreSQL Partitions
why we need partitions The first and most demanding reason to use partitions in a database is to inc ...
- G面经prepare: Android Phone Unlock Pattern
1 2 3 4 5 6 7 8 9 只有中间没有其他键的两个键才能相连,比如1可以连 2 4 5 6 8 但不能连 3 7 9 但是如果中间键被使用了,那就可以连,比如5已经被使用了,那1就可以连9 ...
- VS2012离线安装Xamarin (含破解补丁)
Xamarin离线安装包 来源于 忘忧草 特此感谢! 离线安装不成功:参考源 http://www.cnblogs.com/zjoch/p/3937014.html / http://www.cnb ...