struts2顶用ext框架显示树（tree）形菜单

struts2中用ext框架显示树（tree）形菜单

1、首先导入 ext3框架。

2、创建 Syllabus类，列出在教学大纲案例中所需要的字段，同时也是在节点中显示的内容所需要的字段。

package com.erong.struts.json.domain;

public class Syllabus {
	private String id;
	private String text;
	private String nodeParentId;
	private int nodeLevel;
	private String nodeCode;
	private boolean leaf;
}

3、写一个SyllabusService类，利用类中的getChildrens（）发放，取得数据库里的信息，在节点处显示。

package com.erong.struts.json.service;

import java.util.List;
import org.hibernate.classic.Session;
import com.erong.struts.json.domain.Syllabus;
import com.erong.struts.json.util.HibernateUtil;

public class SyllabusService {
	public List<Syllabus> getChildrens(String nodeId) {
		Session session = HibernateUtil.getSessionFactory().getCurrentSession();
		session.beginTransaction();
		Syllabus syllabus = (Syllabus) session.load(Syllabus.class, nodeId);

		return session.createQuery(
				"from Syllabus where subString (nodeCode,1,2*"
						+ syllabus.getNodeLevel() + ")='"
						+ syllabus.getNodeCode() + "'and nodeLevel="
						+ (syllabus.getNodeLevel() + 1)
						+ " order by nodeCode asc ").list();

	}
}

4、取得数据库信息要利用hibernate，
当然要配置相应的信息：hibernate.cfg.xml和DomainMapping.hbm.xml两个xml文件。

<hibernate-mapping package="com.erong.struts.json.domain">
  <class name="Syllabus" table="syllabus">
  	<id name="id" column="syllabus_id">
  		<generator class="uuid.hex" />
  	</id>
  	<property name="text" column="syllabus_name"/>
  	<property name="nodeParentId" column="parent_id"/>
  	<property name="nodeLevel" column="syllabus_depth"/>
  	<property name="nodeCode" column="syllabus_code"/>
	<property name="leaf" column="is_leaf" type="yes_no" />
  </class>
</hibernate-mapping>

5、要利用struts来控制页面，首先要创建action。用类JsonAction中的execute()方法，
调用SyllabusService中的getChildrens()方法，获取数据信息。当然此处也要在action中配置此信息。

package com.erong.struts.json.action;
import java.util.List;
import com.erong.struts.json.domain.Syllabus;
import com.erong.struts.json.service.SyllabusService;
import com.opensymphony.xwork2.ActionSupport;
public class JsonAction extends ActionSupport {

	private String node;
	private List<Syllabus> nodes;

	public String getNode() {
		return node;
	}

	public void setNode(String node) {
		this.node = node;
	}

	public List<Syllabus> getNodes() {
		return nodes;
	}

	public void setNodes(List<Syllabus> nodes) {
		this.nodes = nodes;
	}

	public String execute() {
		
		SyllabusService ss = new SyllabusService();
		this.nodes = ss.getChildrens(node);
		System.out.println("select node id:" + node);
		System.out.println("元素个数:" + this.nodes.size());
		return SUCCESS;
	}

}

6、自定义结果的显示。创建MyJsonResult类来设置结果集的效果。

package com.erong.struts.json.util;
import java.util.List;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONArray;
import net.sf.json.JSONSerializer;
import org.apache.struts2.dispatcher.StrutsResultSupport;
import com.opensymphony.xwork2.ActionInvocation;
import com.opensymphony.xwork2.util.ValueStack;
public class MyJsonResult extends StrutsResultSupport {
	protected void doExecute(String finalLocation, ActionInvocation invocation)
			throws Exception {

		HttpServletResponse response = (HttpServletResponse) invocation
				.getInvocationContext().get(HTTP_RESPONSE);

		ValueStack vs = invocation.getStack();
		List list = (List) vs.findValue("nodes");
		System.out.println("自定义结果获得的元素个数：" + list.size());
		JSONArray jsonArray = (JSONArray) JSONSerializer.toJSON(list);
		System.out.println(jsonArray.toString());
		response.setCharacterEncoding("utf-8");
		response.getWriter().print(jsonArray.toString());
	}
}

7、最后就是js显示页面，创建index.html，在html页面中调用ext中的js，美化一下美观。
同时也要写js方法，来获取数据信息。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>New Web Project</title>
		<link rel="stylesheet" type="text/css" href="ext3/resources/css/ext-all.css" />
   		<!-- GC --> <!-- LIBS -->
		<script type="text/javascript" src="ext3/adapter/ext/ext-base.js"></script>    
    	<script type="text/javascript" src="ext3/ext-all.js"></script>
		<script type="text/javascript" src="ext3/src/locale/ext-lang-zh_CN.js"></script>
		<script language="JavaScript" type="text/javascript">
			var tree;			
			function initTree() {
				var tree = new Ext.tree.TreePanel({
					loader: new Ext.tree.TreeLoader({dataUrl: '/Struts2Json/JsonDemo.action'})
				});
				
				var rootNode = new Ext.tree.AsyncTreeNode({text:'教学大纲', id:'44417711639f42edb25798368ed11b06'});
				tree.setRootNode(rootNode);
				
				return tree;
			}
			
			Ext.onReady(function() {
				Ext.BLANK_IMAGE_URL = 'ext3/resources/images/default/s.gif';
				//初始化Ext状态管理器，此类可返回用户在Cookie中的操作状态
    			Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
				tree = initTree();
		
				var viewport = new Ext.Viewport({
					layout: "border",
					items: [
					{region: "north", height: 80, split: false},
					{region: "west", layout: "fit", width:300, minWidth: 180, title:"导航树", collapsible: true, split: true, items:[tree]},
					{region: "center", layout: "fit", items:[{}]}
					]
				});
						
				tree.expandAll();
			})
		</script>
    </head>
    <body>  
  
    </body>
</html>

8、表结构在下面的Sysllabus.sql文件中。

1 楼 oyj86 2011-10-21

能发下源码给我么，email:247427748@qq.com,谢谢

struts2顶用ext框架显示树（tree）形菜单

相关推荐