补充 ext treepanel 支持无限级 递归
来源:互联网 发布:聚宝盆软件经典版 编辑:程序博客网 时间:2024/06/05 20:47
最近做了ext的treepanel(版本是ext 3.4)控件,我总结需要注意的有几点:
(1):treepanel接受的是json数据(并且是json数组):例如:["id":1,"text":"权限管理","children":[{},{}],"leaf":false]诸如此json格式的数据才能正确显示出treepanel。当然json你可以自己用json-lib去转换,如果你用的struts2你可以用struts2-json-plugin插件自动去转换(建议用json-lib),如果你用的是springmvc那么你只要配置好了之后,在controller里面返回你封装好的list就可以了。关键在于你怎样封装bean了!
(2)treepanel里面有自己的属性,比如 id text href 等等!也可以自定义属性!后台也可以取到,因为他的Node里面有一个attributes属性专门来存放!只要前面对这个节点封装了,后面就可以取到!但是前台封装的时候必须封装有id ,text leaf children这几个属性,然后转化为List,其他的属性自选,否则tree不能呈现出来!
主要就是这两点:废话少说了开始吧!
一:前台很简单:主要代码:
var rolesLoader = new Ext.tree.TreeLoader({
dataUrl : 'role/getMenuList.do'
});
var rootNode = new Ext.tree.AsyncTreeNode({
id : 'RoleList',
text : '角色列表',
expanded : true,
loader : rolesLoader
});
var roleTreePanel = new Ext.tree.TreePanel({
其余属性省略……
root:rootNode
});
数据库的设计我主要是:
menuId,menuName,menuUrl,parentId 如果只是做一棵树字段足矣:
后台我开始做的是针对于两级菜单的,不够灵活,那么这个也很简单,我就不说了,后面我改成了递归菜单,就支持无限级菜单了!那么sql我写了两个(我这里用的是ibatis):
第一个是:第一级菜单的 这里我就举例子:
select * from Menu where parentid=0; //那么这里得到的就是跟节点下面的直接菜单
第二个是:根据menuid来查询所有菜单的直接菜单,只要有子菜单就循环出来:
select * from Menu where parentid=? //这里问好表示上面查询出实体Menu包含的menuId 这样就能查询出当前节点包含的所有子节点
dao层就是两个方法分别查询,这里我写接口,实现类就不写了:
public List<SysMenu> getParentMenuList();//这里是查询根节点下的直接菜单节点
public List<SysMenu> getChildMenuList(int menuId);//这里查询当前节点下面的所有子节点
service层我写了一个buildTreeMenu()的方法 和一个控制层该调用的方法:(主要是buildTreeMenu递归):
public List<SysMenu> buildTreeMenu(List<SysMenu> topMenuList,
List<SysMenu> resultMenuList) {
resultMenuList=new ArrayList<SysMenu>();
for (SysMenu topMenu : topMenuList) {
if (userDao.getChildMenuList(topMenu.getId()).size()==0) {// 该节点菜单为叶子菜单
topMenu.setLeaf(true); // (无子菜单)不递归了
continue;
}
//开始递归
List<SysMenu> children = userDao.getChildMenuList(topMenu.getId());
topMenu.setChildren(children);
resultMenuList.add(topMenu);
buildTreeMenu(children, resultMenuList);
}
return resultMenuList;
}
public List<SysMenu> getTreeMenuList() {
List<SysMenu> menuList =null;
return this.buildTreeMenu(userDao.getParentMenuList(), menuList);
}
controller层直接调用getTreeMenuList方法返回list转换成了json就能到前台直接显示了:结果:(我的测试数据):
(1):treepanel接受的是json数据(并且是json数组):例如:["id":1,"text":"权限管理","children":[{},{}],"leaf":false]诸如此json格式的数据才能正确显示出treepanel。当然json你可以自己用json-lib去转换,如果你用的struts2你可以用struts2-json-plugin插件自动去转换(建议用json-lib),如果你用的是springmvc那么你只要配置好了之后,在controller里面返回你封装好的list就可以了。关键在于你怎样封装bean了!
(2)treepanel里面有自己的属性,比如 id text href 等等!也可以自定义属性!后台也可以取到,因为他的Node里面有一个attributes属性专门来存放!只要前面对这个节点封装了,后面就可以取到!但是前台封装的时候必须封装有id ,text leaf children这几个属性,然后转化为List,其他的属性自选,否则tree不能呈现出来!
主要就是这两点:废话少说了开始吧!
一:前台很简单:主要代码:
var rolesLoader = new Ext.tree.TreeLoader({
dataUrl : 'role/getMenuList.do'
});
var rootNode = new Ext.tree.AsyncTreeNode({
id : 'RoleList',
text : '角色列表',
expanded : true,
loader : rolesLoader
});
var roleTreePanel = new Ext.tree.TreePanel({
其余属性省略……
root:rootNode
});
数据库的设计我主要是:
menuId,menuName,menuUrl,parentId 如果只是做一棵树字段足矣:
后台我开始做的是针对于两级菜单的,不够灵活,那么这个也很简单,我就不说了,后面我改成了递归菜单,就支持无限级菜单了!那么sql我写了两个(我这里用的是ibatis):
第一个是:第一级菜单的 这里我就举例子:
select * from Menu where parentid=0; //那么这里得到的就是跟节点下面的直接菜单
第二个是:根据menuid来查询所有菜单的直接菜单,只要有子菜单就循环出来:
select * from Menu where parentid=? //这里问好表示上面查询出实体Menu包含的menuId 这样就能查询出当前节点包含的所有子节点
dao层就是两个方法分别查询,这里我写接口,实现类就不写了:
public List<SysMenu> getParentMenuList();//这里是查询根节点下的直接菜单节点
public List<SysMenu> getChildMenuList(int menuId);//这里查询当前节点下面的所有子节点
service层我写了一个buildTreeMenu()的方法 和一个控制层该调用的方法:(主要是buildTreeMenu递归):
public List<SysMenu> buildTreeMenu(List<SysMenu> topMenuList,
List<SysMenu> resultMenuList) {
resultMenuList=new ArrayList<SysMenu>();
for (SysMenu topMenu : topMenuList) {
if (userDao.getChildMenuList(topMenu.getId()).size()==0) {// 该节点菜单为叶子菜单
topMenu.setLeaf(true); // (无子菜单)不递归了
continue;
}
//开始递归
List<SysMenu> children = userDao.getChildMenuList(topMenu.getId());
topMenu.setChildren(children);
resultMenuList.add(topMenu);
buildTreeMenu(children, resultMenuList);
}
return resultMenuList;
}
public List<SysMenu> getTreeMenuList() {
List<SysMenu> menuList =null;
return this.buildTreeMenu(userDao.getParentMenuList(), menuList);
}
controller层直接调用getTreeMenuList方法返回list转换成了json就能到前台直接显示了:结果:(我的测试数据):
好了,菜单做完了,你会了吗?当然 递归或者sql的时候还可以简单一点,我还在想,怎么简化,如果hibernate就可以简单一点!
做到对菜单的任意添加,修改,删除,修改就可以了!给treepanel的节点添加一个右键菜单,就可以了!这样的树才算完美!下次补充!
- 补充 ext treepanel 支持无限级 递归
- Ext.TreePanel
- Ext TreePanel的使用
- EXT TreePanel可以看看
- Ext.tree.TreePanel扩展
- Ext.tree.TreePanel
- ext trigger+treepanel
- Ext.tree.TreePanel
- Ext treePanel方法属性
- Ext JS TreePanel
- ext TreePanel 一次递归加载数据及异步加载数据(点子节点加载数据)
- Ext 3.0下 treepanel 分页
- Ext TreePanel 取得根节点
- Extjs-树 Ext.tree.TreePanel
- ext js中的树treepanel
- Ext.TreePanel基本配置参数
- [Ext.Net]TreePanel自定义图标
- ext TreePanel树节点操作
- 数据结构
- Linux安装subversion
- DISTINCT与ORDER BY
- 组合数学->排列组合
- Linux设备驱动编程模型之上层容器篇
- 补充 ext treepanel 支持无限级 递归
- 也谈(++i)+(++i)+(++i)
- 【转】福昕pdf套件注册码激活
- C++编程学习50个经典网站 强力推荐
- 头像选择效果(ImageButton,Gallery,ImageSwitcher)
- 回调函数
- xss简单渗透测试
- 网站分析基础概念之访问者引用
- 素数和分解