ExtJs tree的应用：动态构建数据库

最新推荐文章于 2021-01-14 10:00:36 发布

pingzi_1119

最新推荐文章于 2021-01-14 10:00:36 发布

阅读量932

点赞数

文章标签： tree extjs string action exception user

本文链接：https://blog.csdn.net/pingzi_1119/article/details/5737831

版权

把这两天做动态树的内容记录一下，留着以后看。

要实现的功能，请求页面时，自动显示根目录及其下面的第一层数据，点击第一层数据节点后请求数据库展开其下一层数据，继续点击节点可得到下层数据。一共有5层。

使用的文件有六个，左侧显示树结构的页面(netree.jsp)，存放树字符串数据的页面（testNodes.jsp）,显示每个节点详细信息的页面（main.jsp），各节点详细信息的action（getDetailAction.java），数据源action（treeAction.java）和执行查询操作的service（navgTreePrc）。其中navgTreePrc类里只是做了查询操作并返回对象list，在此不再贴出。getDetailAction.java跟EXT关系不大，在此也不再贴出。

各个类的功能：

netree.jsp

当netree.jsp页面被请求首次加载时和展开树节点时，页面中根据EXT的中数据源的配置情况自动请求取子节点的treeAction.java。树节点被点击时，请求该节点详细信息的getDetailAction.java（个页面取得数据后把详情信息显示在主页面）

<%@ page language="java" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <%@ taglib uri="/webwork" prefix="w"%> <%@ taglib uri="http://java.sun.com/jstl/core" prefix="c"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>网元树</title> <link rel="stylesheet" type="text/css" media="all" href="ext/resources/css/ext-all.css" mce_href="ext/resources/css/ext-all.css" /> <mce:script type="text/javascript" src="ext/adapter/ext/ext-base.js" mce_src="ext/adapter/ext/ext-base.js"></mce:script> <mce:script type="text/javascript" src="ext/ext-all.js" mce_src="ext/ext-all.js"></mce:script> <mce:style type="text/css"></mce:style><style type="text/css" mce_bogus="1">body{ margin:0px; padding:0px; }</style> <mce:script type="text/javascript"></mce:script> </head> <body bgcolor="white"> <div id="tree-div" style="height:100%"></div> </body> </html>

treeAction.java

action收到请求后根据发出请求的节点的node，请求navgTreePrc，得到该节点的子节点对象列表。action把这个列表数据封装成EXT能识别的格式的字符串result。并转向到“存放数据的页面”（testNodes.jsp）。

package com.inspur.res.action.navgtree; import java.util.List; import javax.jms.Session; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpSession; import com.inspur.res.process.navgtree.INavgTreePrc; import com.opensymphony.webwork.ServletActionContext; import com.opensymphony.xwork.ActionSupport; import com.inspur.res.action.prealarm.AbstractListAction; import com.inspur.res.obj.ResDelagateObj; public class TreeAction extends AbstractListAction{ // 业务逻辑 private INavgTreePrc navgTreePrc; public String result; private String node; public INavgTreePrc getNavgTreePrc() { return navgTreePrc; } public void setNavgTreePrc(INavgTreePrc navgTreePrc) { this.navgTreePrc = navgTreePrc; } // 设置该树为默认树 public String detail() throws Exception { try { StringBuffer resultBuffer = new StringBuffer("["); HttpServletRequest request = ServletActionContext.getRequest(); //String node = request.getParameter("node"); System.out.println("node:"+node); String[] nodes = node.split("#"); //跟节点下挂，网元类型 if("root".equals(node)){ List<ResDelagateObj> objList = navgTreePrc.getAllMscServer(); for( ResDelagateObj obj: objList) { String userLabel = obj.getValue("user_label").toString(); String uuid = obj.getValue("int_id").toString(); resultBuffer.append("{id:'mscs#" + uuid + "#" + userLabel + "',text:'" + userLabel + "',type:'mscserver'},"); } //网元类型下挂生产厂家 }else if( node.startsWith("mscs") ) //mscserver下挂BSC和RNC两个 { //设置BSC的ID为bsc+mscserver的user_label resultBuffer.append("{id:'bsc#" + nodes[2] + "',text:'BSC',type:'bsc'},"); //设置RNC的ID为rnc+mscserver的uuid resultBuffer.append("{id:'rnc#" + nodes[1] + "',text:'RNC',type:'rnc'},"); } else if( node.startsWith("bsc")){ //BSC下挂各个BSC详细 //根据MSCSERVER取得其下的BSC列表 List<ResDelagateObj> objList = navgTreePrc.getAllBscByMscserver(nodes[1]); for( int i = 0; i < objList.size(); i++) { ResDelagateObj obj = objList.get(i); String userLabel = obj.getValue("user_label").toString(); String uuid = obj.getValue("int_id").toString(); resultBuffer.append("{id:'subbsc#" + uuid + "#" + userLabel + "',text:'" + userLabel + "',type:'subbsc'},"); } }else if (node.startsWith("rnc")) //BSC下挂各个BSC详细 { //根据MSCSERVER取得其下的RNC列表 List<ResDelagateObj> objList = navgTreePrc.getAllRNCByMscserver(nodes[1]); for( ResDelagateObj obj: objList) { String userLabel = obj.getValue("label_cn").toString(); String uuid = obj.getValue("int_id").toString(); //resultBuffer.append("{id:'subrnc#"+uuid+"#"+userLabel+"',text:'"+ userLabel +"',type:'subrnc'},"); resultBuffer.append("{id:'subrnc#" + uuid + "#" + userLabel + "',text:'" + userLabel + "',type:'subrnc'},"); } }else if (node.startsWith("subbsc")) //subBSC下挂BTS { //根据MSCSERVER取得其下的RNC列表 List<ResDelagateObj> objList = navgTreePrc.getAllBtsByBsc(nodes[2]); for( ResDelagateObj obj: objList) { String userLabel = obj.getValue("user_label").toString(); String uuid = obj.getValue("int_id").toString(); resultBuffer.append("{text:'" + userLabel + "',type:'bts',leaf:true},"); } }else if (node.startsWith("subrnc")) //subrnc下挂各个Nodeb { //根据MSCSERVER取得其下的RNC列表 List<ResDelagateObj> objList = navgTreePrc.getAllNodeBByRnc(nodes[1]); for( ResDelagateObj obj: objList) { String userLabel = obj.getValue("remark").toString(); String uuid = obj.getValue("int_id").toString(); resultBuffer.append("{id:'nodeB#" + uuid + "#" + userLabel + "',text:'" + userLabel + "',type:'nodeb',leaf:true},"); } } resultBuffer.deleteCharAt(resultBuffer.length() -1 ); resultBuffer.append("]"); result = resultBuffer.toString(); } catch (Exception e) { addActionError("删除告警指标信息出错，错误信息：" + e.getMessage()); System.out.println(e.getMessage()); return ERROR; } return "tree"; } public String getResult() { return result; } public void setResult(String result) { this.result = result; } public String getNode() { return node; } public void setNode(String node) { this.node = node; } }

这个action的配置信息如下：

<action name="treeAction" class="testTreeAction" ethod="detail"> <result name="tree">/testNodes.jsp</result> <result name="error">/navgtree/error.jsp</result> </action>

testNodes.jsp

这个页面从request中取得result字符串，并输出在页面上。

<%@page contentType="text/html; charset=GB2312" language="java" errorPage="" %> <% //现指定节点ID为1,即显示以1为根节点的树,注意最后显示时加上最外层[] String result = (String)request.getAttribute("result"); System.out.println(result); response.setContentType("text/json;charset=utf-8"); response.getWriter().write(result); //out.print(result); %>

pingzi_1119

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
ExtJs tree的应用：动态构建数据库

<br />把这两天做动态树的内容记录一下，留着以后看。<br />要实现的功能，请求页面时，自动显示根目录及其下面的第一层数据，点击第一层数据节点后请求数据库展开其下一层数据，继续点击节点可得到下层数据。一共有5层。<br />使用的文件有六个，左侧显示树结构的页面(netree.jsp)，存放树字符串数据的页面（testNodes.jsp）,显示每个节点详细信息的页面（main.jsp），各节点详细信息的action（getDetailAction.java），数据源action（treeAction.
复制链接

扫一扫