dhtmlxTree总结

cn_arthurs

浏览: 327032 次
性别:
来自: 北京

最近访客更多访客>>

ningzong

shdavidzhang

robotmen

zhang_sun

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

web应用

Bean XML CSS Cache QQ

最近有一个项目需要做到无限级树型菜单,而且要实现右键的功能,经别人的介绍,我接触到了dhtmlxtree,虽然最后并没有使用它,但是我想以后会有机会用的

在官方给出的例子中,加载一个xml文件很简单,文件内容如下

xml 代码

<?xml version='1.0' encoding='utf-8'?>
<tree id="0" text="root">
<item text="Books" id="books" im0="books_close.gif" im1="tombs.gif" im2="tombs.gif" src="http://www.baidu.com">
<item text="Mystery & Thrillers" id="mystery" im0="book.gif" im1="books_open.gif" im2="books_close.gif">
<item text="Lawrence Block" id="lb" im0="book.gif" im1="books_open.gif" im2="book.gif">
<item text="All the Flowers Are Dying" id="a1" im0="book_titel.gif" im1="book_titel.gif" im2="book_titel.gif" child="1">
</item>
<item text="The Burglar on the Prowl" id="lb_2" im0="book_titel.gif" im1="book_titel.gif" im2="book_titel.gif"/>
<item text="The Plot Thickens" id="lb_3" im0="book_titel.gif" im1="book_titel.gif" im2="book_titel.gif"/>
<item text="Grifter's Game" id="lb_4" im0="book_titel.gif" im1="book_titel.gif" im2="book_titel.gif"/>
<item text="The Burglar Who Thought He Was Bogart" id="lb_5" im0="book_titel.gif" im1="book_titel.gif" im2="book_titel.gif"/>
</item>
</item>
</item>
</tree>

简单了解下,id就是这个节点ID,text是显示的内容,src是点击时的超链接,有了这个xml文件的结构之后,我们就可以通过页面发出请求访问后台,由后台生成类似的xml的字符串,发送到页面,有页面进行接收处理

在页面中的显示如下

js 代码

<link rel="STYLESHEET" type="text/css" href="../css/dhtmlXTree.css">
<script src="../js/dhtmlXCommon.js"></script>
<script src="../js/dhtmlXTree.js"></script>
......
<div id="treeboxbox_tree"></div>
<script>
tree=new dhtmlXTreeObject("treeboxbox_tree","100%","100%",0);
tree.setImagePath("../imgs/");
tree.setXMLAutoLoading("http://localhost:8082/jh_directoryManager/tree/treeLoad.do?method=open");
tree.loadXML("http://localhost:8082/jh_directoryManager/tree/treeLoad.do?method=init");
tree.setOnRightClickHandler(viewRight);//设置右键调用方法
</script>

这里的tree.loadXML说的明白一点,就是页面第一次打开的时候,访问的请求

tree.setXMLAutoLoading是展开树发送的请求

还可以通过查看API定义一些事件处理如

js 代码

tree.setOnRightClickHandler(viewRight);//设置右键调用方法

这是的意思是说当在树节点上点击右键的时候,会调用viewRight方法

因为在dhtmlxtree中定义右键菜单,我始终没有弄出来,所以最后放弃使用这个工具

好了,在帖下后台的代码,如下

java 代码

/**
* 初始化root表显示根节点使用dhtmlTree
* @param mapping
* @param form
* @param request
* @param response
* @return
*/
public ActionForward init(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response){
FtpRootPathService ftpRootPathService = (FtpRootPathService)this.getWebApplicationContext().getBean("ftpRootPathService");
OrganizationService organizationService = (OrganizationService)this.getWebApplicationContext().getBean("organizationService");
// List list = organizationService.getRootOrgs();
//--- 测试数据开始
List list = new ArrayList();
// TreeBean bean = new TreeBean();
// bean.setId("1");bean.setName("机构1");bean.setCount("10");
// list.add(bean);
// TreeBean bean2 = new TreeBean();
// bean2.setId("2");bean2.setName("机构2");bean2.setCount("0");
// list.add(bean2);
// TreeBean bean4 = new TreeBean();
// bean4.setId("3");bean4.setName("机构4");bean4.setCount("3");
// list.add(bean4);
//--- 测试数据结束
response.setContentType("text/xml;charset=UTF-8");
response.setHeader("Cache-Control","no-cache");
try {
System.out.println(createDHTMLXML("0",list));
response.getWriter().print(createDHTMLXML("0",list));//dhtmlxTree方式
} catch (IOException e) {
e.printStackTrace();
}
return null;
}
/**
* 展开子节点处理
* @param mapping
* @param form
* @param request
* @param response
* @return
*/
public ActionForward open(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response){
FtpRootPathService ftpRootPathService = (FtpRootPathService)this.getWebApplicationContext().getBean("ftpRootPathService");
OrganizationService organizationService = (OrganizationService)this.getWebApplicationContext().getBean("organizationService");
response.setContentType("text/xml;charset=UTF-8");
response.setHeader("Cache-Control","no-cache");
String id = request.getParameter("id");
//根据上一级节点,查询该节点下的所有节点及再下一级节点总个数
List orgList = organizationService.getOrgChilds(id);
// StringBuffer sb = new StringBuffer();
// sb.append("<?xml version='1.0' encoding='utf-8'?>\n");
// sb.append("<tree id=\""+id+"\">\n");
// for(int i=0;i<4;i++){
// sb.append("<item text=\""+id+"_"+i+"\" id=\""+id+"_"+i+"\" im0=\"books_close.gif\" im1=\"tombs.gif\" im2=\"tombs.gif\" child=\"1\"></item>\n");
// }
// sb.append("</tree>");
try {
System.out.println(createDHTMLXML(id,orgList));
response.getWriter().print(createDHTMLXML(id,orgList));
} catch (IOException e) {
e.printStackTrace();
}
return null;
}
/**
* 生成dhtmlTree的xml文件
* @param rootList
* @return
*/
public String createDHTMLXML(String id,List rootList){
StringBuffer buffer = new StringBuffer();
buffer.append("<?xml version='1.0' encoding='utf-8'?>\n<tree id=\""+id+"\">\n");
for(int i=0;i<rootList.size();i++){
TreeBean bean = (TreeBean)rootList.get(i);
//添加主目录
buffer.append("\t<item text=\""+bean.getName()+"\" id=\""+bean.getId()+"\" im0=\"books_close.gif\" im1=\"tombs.gif\" im2=\"tombs.gif\" ");
//判断是否有子节点,有的话,虚拟一个,强制页面显示有子节点样式
if(!bean.getCount().equals("0")){
buffer.append(" child=\"1\"");
}
buffer.append(">\n");
buffer.append("\t</item>\n");
// buffer.append("<item text="+id+"_"+i+" id="+id+"_"+i+" im0=\"books_close.gif\" im1=\"tombs.gif\" im2=\"tombs.gif\"></item>");
}
buffer.append("</tree> ");
return buffer.toString();
}

结语:如果哪位高手在dhtmlxtree中加入了右键菜单,还望不吝赐教

分享到：

使用 JFreeChart来创建基于web的图表 | java实现网卡数据包抓取学习

2007-11-23 09:41
浏览 17835
评论(5)
查看更多

5 楼 lilinshtandby 2013-10-29

不错不错，赞一个

4 楼 cn_arthurs 2009-01-05

QQ：307215311

3 楼 Mystic 2009-01-04

http://www.cnblogs.com/jacklaw/archive/2008/07/23/1249788.html

cn_arthurs 写道

http://www.cnblogs.com/jacklaw/archive/2008/07/23/1249788.html 转载收藏

你好你能给我你的联系方式吗我想问你下 dhtmltree的相关问题

2 楼 cn_arthurs 2008-12-01

http://www.cnblogs.com/jacklaw/archive/2008/07/23/1249788.html
转载收藏

1 楼 bigbone 2008-09-11

右键菜单你得自己去写代码生成，它只是提供了一个右键点击树的一个接口，可以自己用js写个右键菜单，来达到你的要求，这个可以实现，我成功过。

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论