xloadtree 生成树形菜单

 

xloadtree是一个使用Ajax技术动态加载树形菜单的工具，其js文件可以到  http://webfx.eae.net/dhtml/xloadtree/xloadtree.html 下载

需要其中的三个js文件：xloadtree.js   xmlextras.js  xtree.js  以及 xtree.css  images图片文件夹

使用步骤如下：

1、在Servlet或者struts的Action中生成xml文件（本文用的是struts2.0的action），代码如下

package com.xdja.menu;

import java.util.List;

import com.opensymphony.xwork2.Action;

/**

 * 动态构建菜单

 * 

 * @author liuzhenfeng

 */

public class MenuAction implements Action {

private MenuService menuService;

private String code ;

private String xml ;

public String getCode() {

return code;

}

public void setCode(String code) {

this.code = code;

}

public MenuService getMenuService() {

return menuService;

}

public void setMenuService(MenuService menuService) {

this.menuService = menuService;

}

public String getXml() {

return xml;

}

public void setXml(String xml) {

this.xml = xml;

}

@Override

public String execute() throws Exception {

int id = Integer.parseInt(code) ;

List<Menu> list = menuService.getMenusById(id);

StringBuffer xmlMenu = new StringBuffer();

xmlMenu.append("<?xml version=/"1.0/" encoding=/"UTF-8/"?>");

xmlMenu.append("<tree>");

if (null != list) {

for (int i = 0; i < list.size(); i++) {

Menu m = list.get(i);

xmlMenu.append("<tree text=/"" + m.getText() + "/" action=/""

+ m.getUrl() + "/" target=/""+m.getTarget()+"/" />");

}

}

xmlMenu.append("</tree>");

xml = xmlMenu.toString() ;

return Action.SUCCESS;

}

/**

 * 查询菜单的根目录（其实这个可以和普通目录放到一个方法里，他们只有一个属性不同）

 * @return

 * @throws Exception

 */

public String getRootMenu() throws Exception {

int id = Integer.parseInt(code) ;

List<Menu> list = menuService.getMenusById(id);

StringBuffer xmlMenu = new StringBuffer();

xmlMenu.append("<?xml version=/"1.0/" encoding=/"UTF-8/"?>");

xmlMenu.append("<tree>");

if (null != list) {

for (int i = 0; i < list.size(); i++) {

Menu m = list.get(i);

xmlMenu.append("<tree text=/"" + m.getText() + "/" src=/""

+ m.getUrl() + "/" />");

}

}

xmlMenu.append("</tree>");

xml = xmlMenu.toString() ;

return Action.SUCCESS;

}

}

2、在struts.xml文件中配置

                <action name="menuAction" class="menuAction">

<result name="success">/frame/menu.jsp</result>

</action>

3、创建一个过度的jsp文件menu.jsp

<%

response.setContentType("text/xml; charset=utf-8");

String xml = (String) request.getAttribute("xml") ;

out.write(xml) ;

%>

如果使用Servlet，不用2，3步，可以直接PrintWriter w = response.getWriter() ; w.writer(xml）；直接写到浏览器就行了

4、在jsp文件中显示tree

 <script type="text/javascript">

    var tree = new WebFXLoadTree("安全授权访问平台","menuAction!getRootMenu.action?code=0","","explorer") ;

     document.write(tree);

    </script>

explorer : 表示默认展开

code 表示菜单的PID

5、数据库脚本

-- Create table

create table MENU

(

  ID     INTEGER not null,

  PID    INTEGER,

  TEXT   VARCHAR2(100),

  URL    VARCHAR2(100),

  INFO   VARCHAR2(200),

  TARGET VARCHAR2(50)

)

tablespace USERS

  pctfree 10

  initrans 1

  maxtrans 255

  storage

  (

    initial 64K

    minextents 1

    maxextents unlimited

  );

-- Add comments to the columns 

comment on column MENU.ID

  is '当前节点的ID';

comment on column MENU.PID

  is '当前节点的父节点的ID ';

comment on column MENU.TEXT

  is '节点要显示的文字';

comment on column MENU.URL

  is '点击该节点的超链接（注意也可以是某个servlet或是struts应用中的某个.do请求） ';

comment on column MENU.INFO

  is '鼠标移至该节点时显示的文字 ';

comment on column MENU.TARGET

  is '点击该节点时在哪个桢中打开超链接';

-- Create/Recreate primary, unique and foreign key constraints