struts2树状菜单实现
一.概要:
这篇文章是自己在学习struts2时从struts2的官方英文文档实例中整理出来的，此处介绍三种struts2树状菜单的实现方式
分别是:静态，动态，动态Ajax三种方式.
以下实例均在windowsXpsp2+struts2+MyEcliplse6.01+Tomcat6.0.14+jdk1.6.0_03
下调试通过,项目名称为study3,包名为com.zhang.struts3
这三种实例用到的包文件(,jar包)如下:
commons-io-1.3.2.jar
ognl-2.6.11.jar
struts2-core-2.1.2.jar
struts2-dojo-plugin-2.1.2.jar
xwork-2.1.1.jar
二.具体实现
1.静态指单独使用struts2的tree标签脚本实现的．如以下文件treeStatic.jsp
此文件不需要任何Action类支持,启动Tomcat后在地址栏中输入:
http://127.0.0.1:8080/study3/treeStatic.jsp就行．
*****treeStatic.jsp********************************************************************
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sx" uri="/struts-dojo-tags"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<Html>
<head>
<sx:head />
<base href="<%=basePath%>">
<title>Tree Example(Static)</title>
<meta http-equiv="content-type" content="text/Html; charset=UTF-8">
<script language="javaScript" type="text/javascript">
dojo.event.topic.subscribe("treeSelected", function treeNodeSelected(node) {
dojo.io.bind({
url: "<s:url value='/info/staticTreeAction.action'/>?nodeId="+node.node.title,
load: function(type, data, evt) {
var divDisplay = dojo.byId("displayIt");
divDisplay.innerHtml=data;
},
mimeType: "text/Html"
});
});
</script>
</head>
<body>
<div id="displayIt">
Please click on any node on the tree.
</div>
<div style="float: left; margin-right: 50px;">
<sx:tree label="软件工程" templateCssPath="/struts/tree.CSS"
showROOtGrid="true" showGrid="true" treeSelectedTopic="treeSelected">
<sx:treenode label="开发工具">
<sx:treenode label="java" id="grandchild1Id" />
<sx:treenode label="c++" id="grandchild2Id" />
<sx:treenode label="delphi" id="grandchild3Id" />
</sx:treenode>
<sx:treenode label="编程思想" id="child2Id" />
<sx:treenode label="数据结构" id="child3Id" />
<sx:treenode label="设计模式" id="child4Id" />
<sx:treenode label="相关框架插件" id="child5Id">
<sx:treenode label="Dojo" id="gChild1Id" />
<sx:treenode label="hibernate" id="gChild2Id" />
</sx:treenode>
</sx:tree>
</div>
</body>
</Html>
******************************************************************************
2.动态树状菜单:地址栏访问方法http://127.0.0.1:8080/study3/tree/showDynamicTreeAction.action
具体需要如下文件:struts2的类库文件即与struts2相关的包文件,web.xml,struts.xml,动态树状菜单的显示页面treeExampleDynamic.jsp,
辅助显示页面:dynamicTreeSelect.jsp,动态Action类文件DynamicTreeSelectAction.java，
提供数据的Bean类文件:Category.java,
******************************************************************************
所需要的包文件如下:
******************************************************************************
commons-fileupload-1.2.1.jar
commons-io-1.3.2.jar
freemarker-2.3.12.jar
ognl-2.6.11.jar
struts2-core-2.1.2.jar
xwork-2.1.1.jar
struts2-dojo-plugin-2.1.2.jar
******************************************************************************
web.xml配置文件
*****web.xml******************************************************************
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee
http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
<filter>
<filter-name>struts2</filter-name>
<filter-class>
org.apache.struts2.dispatcher.FilterDispatcher
</filter-class>
</filter>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
******************************************************************************
在此struts.xml配置文件中我将动态树状菜单以及动态Ajax树状菜单的配置内容写在了这一个
配置文件中,其中动态树状菜单需要的action有dynamicTreeSelectAction,showDynamicTreeAction
动态Ajax树状菜单需要的action有dynamicTreeSelectAction,showDynamicAjaxTreeAction,
getNodes,这两个实例共用了提供数据的bean类文件Category.java文件.同时它们共用了
dynamicTreeSelectAction，但用于显示的Action类文件分别用了自己的Action类文件．
******************************************************************************
*******struts.xml***************************************************************
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<package name="default" extends="struts-default"
namespace="/tree">
<action name="dynamicTreeSelectAction"
class="com.zhang.study3.DynamicTreeSelectAction">
<result>/dynamicTreeSelect.jsp</result>
</action>
<action name="showDynamicTreeAction"
class="com.zhang.study3.ShowDynamicTreeAction">
<result>/treeExampleDynamic.jsp</result>
</action>
<action name="showDynamicAjaxTreeAction">
<result>/treeExampleAjaxDynamic.jsp</result>
</action>
<action name="getNodes"
class="com.zhang.study3.ShowAjaxDynamicTreeAction">
<result type="freemarker">
/treeExampleAjaxDynamic.ftl
</result>
</action>
</package>
</struts>
******************************************************************************
********treeExampleDynamic.jsp***************************************************
<%@ page language="java" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sx" uri="/struts-dojo-tags"%>
<Html>
<head>
<title>Showcase - UI Tag Example - Tree Example (Dynamic)</title>
<sx:head />
</head>
<body>
<script language="javaScript" type="text/javascript">
dojo.event.topic.subscribe("treeSelected", function treeNodeSelected(node) {
dojo.io.bind({
url: "<s:url value='/tree/dynamicTreeSelectAction.action'/>?nodeId="+node.node.widgetId,
load: function(type, data, evt) {
var divDisplay = dojo.byId("displayId");
divDisplay.innerHtml=data;
},
mimeType: "text/Html"
});
});
</script>
<div style="float: left; margin-right: 50px;">
<sx:tree id="tree" rootNode="%{treeROOtNode}"
childCollectionProperty="children" nodeIdProperty="id"
nodeTitleProperty="name" treeSelectedTopic="treeSelected">
</sx:tree>
</div>
<div id="displayId">
Please click on any of the tree nodes.
</div>
</body>
</Html>
******************************************************************************
******dynamicTreeSelect.jsp***************************************************
<%@ page language="java" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags" %>
Id:<s:property value="%{nodeId}" /><br/>
Name:<s:property value="%{nodeName}" /><br/>
(注:此文件就这三行代码负责将你选择的树状菜单相应结点信息如节点Id值与节点名称显示
在.jsp页面上．)
******************************************************************************
用于生成树状菜单的Action类文件
******DynamicTreeSelectAction.java********************************************
package com.zhang.study3;
import com.opensymphony.xwork2.ActionSupport;
import com.zhang.study3.Category;
public class DynamicTreeSelectAction extends ActionSupport {
private long nodeId;
private Category currentCategory;
public void setNodeId(long nodeId) {
this.nodeId = nodeId;
}
public long getNodeId() {
return nodeId;
}
public String execute() throws Exception {
currentCategory = Category.getById(nodeId);
return SUCCESS;
}
public String getNodeName() {
return currentCategory != null ? currentCategory.getName() : "Node not found";
}
}
******************************************************************************
提供数据的bean类文件
****Category.java*************************************************************
package com.zhang.study3;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
public class Category {
private static Map<Long, Category> catMap = new HashMap<Long, Category>();
static {
new Category(1, "省总公司",
new Category(2, "地市1分公司",
new Category(3, "桥东区办事处",
new Category(4, "市场组"),
new Category(7, "客服组"),
new Category(8, "技术组")),
new Category(9, "开发区办事处",
new Category(10, "市场组"),
new Category(11, "客服组"),
new Category(12, "技术组"),
new Category(13, "后勤组"))),
new Category(14, "地市2分公司",
new Category(15, "软件开发组"),
new Category(16, "软件测试组"),
new Category(17, "售后服务组"),
new Category(18, "市场拓展组"),
new Category(19, "财物组")));
}
public static Category getById(long id) {
return catMap.get(id);
}
private long id;
private String name;
private List<Category> children;
private bOOlean toggle;
public Category(long id, String name, Category... children) {
this.id = id;
this.name = name;
this.children = new ArrayList<Category>();
for (Category child : children) {
this.children.add(child);
}
catMap.put(id, this);
}
public long getId() {
return id;
}
public void setId(long id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public List<Category> getChildren() {
return children;
}
public void setChildren(List<Category> children) {
this.children = children;
}
public void toggle() {
toggle = !toggle;
}
public bOOlean isToggle() {
return toggle;
}
}
******************************************************************************
用于显示树状菜单的Action类文件
*****ShowDynamicTreeAction.java************************************************
package com.zhang.study3;
import com.opensymphony.xwork2.ActionSupport;
import com.zhang.study3.Category;
public class ShowDynamicTreeAction extends ActionSupport {
public Category getTreeROOtNode() {
return Category.getById(1);
}
}
致此动态树状菜单的实例已经完成，可以测试了．
******************************************************************************
3.动态Ajax树状菜单:
地址栏访问方法:http://127.0.0.1:8080/study3/tree/showDynamicAjaxTreeAction.action
具体需要如下文件:
动态树状菜单的显示页面:treeExampleAjaxDynamic.jsp,
dojo辅助文件treeExampleAjaxDynamic.ftl,动态Action类文件
ShowAjaxDynamicTreeAction.java,DynamicTreeSelectAction.java(此文件同上)
******************************************************************************
动态Ajax树状菜单的action类文件
******ShowAjaxDynamicTreeAction.java******************************************
package com.zhang.study3;
import com.zhang.study3.Category;
import com.opensymphony.xwork2.ActionSupport;
public class ShowAjaxDynamicTreeAction extends ActionSupport {
private int nodeId = 1;
public Category getCategory() {
return Category.getById(nodeId);
}
public int getNodeId() {
return nodeId;
}
public void setNodeId(int nodeId) {
this.nodeId = nodeId;
}
}
******************************************************************************
显示Ajax树状菜单的.jsp页面
*****treeExampleAjaxDynamic.jsp***********************************************
<%@ page language="java" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sx" uri="/struts-dojo-tags"%>
<Html>
<head>
<title>Showcase - UI Tag Example - Tree Example (Dynamic)</title>
<sx:head />
</head>
<body>
<script language="javaScript" type="text/javascript">
dojo.event.topic.subscribe("treeSelected", function treeNodeSelected(node) {
dojo.io.bind({
url: "<s:url value='/tree/dynamicTreeSelectAction.action'/>?nodeId="+node.node.widgetId,
load: function(type, data, evt) {
var divDisplay = dojo.byId("displayId");
divDisplay.innerHtml=data;
},
mimeType: "text/Html"
});
});
</script>
<s:url var="nodesUrl" namespace="/tree" action="getNodes" />
<div style="float: left; margin-right: 50px;">
<sx:tree id="tree" href="%{#nodesUrl}"
treeSelectedTopic="treeSelected" />
</div>
<div id="displayId">
Please click on any of the tree nodes.
</div>
</body>
</Html>
******************************************************************************
辅助生成Ajax树状菜单的.ftl文件，此文件是从官方Struts2的实例包struts2-showcase-2.1.2
中找到复制到项目中的，你也可以按以下代码用记事本保存一个此文件．
****treeExampleAjaxDynamic.ftl************************************************
[
<#list category.children as node>
{
label: '${node.name}',
id: '${node.id}',
hasChildren: ${(node.children.size() > 0)?string}
},
</#list>
]
******************************************************************************
显示Ajax的Action类文件
***ShowAjaxDynamicTreeAction.java**********************************************
package com.zhang.study3;
import com.zhang.study3.Category;
import com.opensymphony.xwork2.ActionSupport;
public class ShowAjaxDynamicTreeAction extends ActionSupport {
private int nodeId = 1;
public Category getCategory() {
return Category.getById(nodeId);
}
public int getNodeId() {
return nodeId;
}
public void setNodeId(int nodeId) {
this.nodeId = nodeId;
}
}
******************************************************************************
致此动态Ajax树状菜单的实例已经完成，可以测试了．
需要注意的是后两种动态树状菜单在地址栏访问时必须以action的方式来访问，而且在以上两种地址栏中
的"/tree"中在struts.xml中配置的命名空间的值即: namespace="/tree"如果输入的是相应的.jsp文件来访问，将不会成功出现想要的结果．
其实以上两个动态菜单的实例还可以进一步扩展，将提供数据的Category.java中的静态数据通过mysql或其它数据库来提供就更实用了．如果有时间我会再整理出通过数据库来提供数据的方式．
一.概要:
这篇文章是自己在学习struts2时从struts2的官方英文文档实例中整理出来的，此处介绍三种struts2树状菜单的实现方式
分别是:静态，动态，动态Ajax三种方式.
以下实例均在windowsXpsp2+struts2+MyEcliplse6.01+Tomcat6.0.14+jdk1.6.0_03
下调试通过,项目名称为study3,包名为com.zhang.struts3
这三种实例用到的包文件(,jar包)如下:
commons-io-1.3.2.jar
ognl-2.6.11.jar
struts2-core-2.1.2.jar
struts2-dojo-plugin-2.1.2.jar
xwork-2.1.1.jar
二.具体实现
1.静态指单独使用struts2的tree标签脚本实现的．如以下文件treeStatic.jsp
此文件不需要任何Action类支持,启动Tomcat后在地址栏中输入:
http://127.0.0.1:8080/study3/treeStatic.jsp就行．
*****treeStatic.jsp********************************************************************
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sx" uri="/struts-dojo-tags"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<Html>
<head>
<sx:head />
<base href="<%=basePath%>">
<title>Tree Example(Static)</title>
<meta http-equiv="content-type" content="text/Html; charset=UTF-8">
<script language="javaScript" type="text/javascript">
dojo.event.topic.subscribe("treeSelected", function treeNodeSelected(node) {
dojo.io.bind({
url: "<s:url value='/info/staticTreeAction.action'/>?nodeId="+node.node.title,
load: function(type, data, evt) {
var divDisplay = dojo.byId("displayIt");
divDisplay.innerHtml=data;
},
mimeType: "text/Html"
});
});
</script>
</head>
<body>
<div id="displayIt">
Please click on any node on the tree.
</div>
<div style="float: left; margin-right: 50px;">
<sx:tree label="软件工程" templateCssPath="/struts/tree.CSS"
showROOtGrid="true" showGrid="true" treeSelectedTopic="treeSelected">
<sx:treenode label="开发工具">
<sx:treenode label="java" id="grandchild1Id" />
<sx:treenode label="c++" id="grandchild2Id" />
<sx:treenode label="delphi" id="grandchild3Id" />
</sx:treenode>
<sx:treenode label="编程思想" id="child2Id" />
<sx:treenode label="数据结构" id="child3Id" />
<sx:treenode label="设计模式" id="child4Id" />
<sx:treenode label="相关框架插件" id="child5Id">
<sx:treenode label="Dojo" id="gChild1Id" />
<sx:treenode label="hibernate" id="gChild2Id" />
</sx:treenode>
</sx:tree>
</div>
</body>
</Html>
******************************************************************************
2.动态树状菜单:地址栏访问方法http://127.0.0.1:8080/study3/tree/showDynamicTreeAction.action
具体需要如下文件:struts2的类库文件即与struts2相关的包文件,web.xml,struts.xml,动态树状菜单的显示页面treeExampleDynamic.jsp,
辅助显示页面:dynamicTreeSelect.jsp,动态Action类文件DynamicTreeSelectAction.java，
提供数据的Bean类文件:Category.java,
******************************************************************************
所需要的包文件如下:
******************************************************************************
commons-fileupload-1.2.1.jar
commons-io-1.3.2.jar
freemarker-2.3.12.jar
ognl-2.6.11.jar
struts2-core-2.1.2.jar
xwork-2.1.1.jar
struts2-dojo-plugin-2.1.2.jar
******************************************************************************
web.xml配置文件
*****web.xml******************************************************************
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee
http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
<filter>
<filter-name>struts2</filter-name>
<filter-class>
org.apache.struts2.dispatcher.FilterDispatcher
</filter-class>
</filter>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
******************************************************************************
在此struts.xml配置文件中我将动态树状菜单以及动态Ajax树状菜单的配置内容写在了这一个
配置文件中,其中动态树状菜单需要的action有dynamicTreeSelectAction,showDynamicTreeAction
动态Ajax树状菜单需要的action有dynamicTreeSelectAction,showDynamicAjaxTreeAction,
getNodes,这两个实例共用了提供数据的bean类文件Category.java文件.同时它们共用了
dynamicTreeSelectAction，但用于显示的Action类文件分别用了自己的Action类文件．
******************************************************************************
*******struts.xml***************************************************************
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<package name="default" extends="struts-default"
namespace="/tree">
<action name="dynamicTreeSelectAction"
class="com.zhang.study3.DynamicTreeSelectAction">
<result>/dynamicTreeSelect.jsp</result>
</action>
<action name="showDynamicTreeAction"
class="com.zhang.study3.ShowDynamicTreeAction">
<result>/treeExampleDynamic.jsp</result>
</action>
<action name="showDynamicAjaxTreeAction">
<result>/treeExampleAjaxDynamic.jsp</result>
</action>
<action name="getNodes"
class="com.zhang.study3.ShowAjaxDynamicTreeAction">
<result type="freemarker">
/treeExampleAjaxDynamic.ftl
</result>
</action>
</package>
</struts>
******************************************************************************
********treeExampleDynamic.jsp***************************************************
<%@ page language="java" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sx" uri="/struts-dojo-tags"%>
<Html>
<head>
<title>Showcase - UI Tag Example - Tree Example (Dynamic)</title>
<sx:head />
</head>
<body>
<script language="javaScript" type="text/javascript">
dojo.event.topic.subscribe("treeSelected", function treeNodeSelected(node) {
dojo.io.bind({
url: "<s:url value='/tree/dynamicTreeSelectAction.action'/>?nodeId="+node.node.widgetId,
load: function(type, data, evt) {
var divDisplay = dojo.byId("displayId");
divDisplay.innerHtml=data;
},
mimeType: "text/Html"
});
});
</script>
<div style="float: left; margin-right: 50px;">
<sx:tree id="tree" rootNode="%{treeROOtNode}"
childCollectionProperty="children" nodeIdProperty="id"
nodeTitleProperty="name" treeSelectedTopic="treeSelected">
</sx:tree>
</div>
<div id="displayId">
Please click on any of the tree nodes.
</div>
</body>
</Html>
******************************************************************************
******dynamicTreeSelect.jsp***************************************************
<%@ page language="java" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags" %>
Id:<s:property value="%{nodeId}" /><br/>
Name:<s:property value="%{nodeName}" /><br/>
(注:此文件就这三行代码负责将你选择的树状菜单相应结点信息如节点Id值与节点名称显示
在.jsp页面上．)
******************************************************************************
用于生成树状菜单的Action类文件
******DynamicTreeSelectAction.java********************************************
package com.zhang.study3;
import com.opensymphony.xwork2.ActionSupport;
import com.zhang.study3.Category;
public class DynamicTreeSelectAction extends ActionSupport {
private long nodeId;
private Category currentCategory;
public void setNodeId(long nodeId) {
this.nodeId = nodeId;
}
public long getNodeId() {
return nodeId;
}
public String execute() throws Exception {
currentCategory = Category.getById(nodeId);
return SUCCESS;
}
public String getNodeName() {
return currentCategory != null ? currentCategory.getName() : "Node not found";
}
}
******************************************************************************
提供数据的bean类文件
****Category.java*************************************************************
package com.zhang.study3;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
public class Category {
private static Map<Long, Category> catMap = new HashMap<Long, Category>();
static {
new Category(1, "省总公司",
new Category(2, "地市1分公司",
new Category(3, "桥东区办事处",
new Category(4, "市场组"),
new Category(7, "客服组"),
new Category(8, "技术组")),
new Category(9, "开发区办事处",
new Category(10, "市场组"),
new Category(11, "客服组"),
new Category(12, "技术组"),
new Category(13, "后勤组"))),
new Category(14, "地市2分公司",
new Category(15, "软件开发组"),
new Category(16, "软件测试组"),
new Category(17, "售后服务组"),
new Category(18, "市场拓展组"),
new Category(19, "财物组")));
}
public static Category getById(long id) {
return catMap.get(id);
}
private long id;
private String name;
private List<Category> children;
private bOOlean toggle;
public Category(long id, String name, Category... children) {
this.id = id;
this.name = name;
this.children = new ArrayList<Category>();
for (Category child : children) {
this.children.add(child);
}
catMap.put(id, this);
}
public long getId() {
return id;
}
public void setId(long id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public List<Category> getChildren() {
return children;
}
public void setChildren(List<Category> children) {
this.children = children;
}
public void toggle() {
toggle = !toggle;
}
public bOOlean isToggle() {
return toggle;
}
}
******************************************************************************
用于显示树状菜单的Action类文件
*****ShowDynamicTreeAction.java************************************************
package com.zhang.study3;
import com.opensymphony.xwork2.ActionSupport;
import com.zhang.study3.Category;
public class ShowDynamicTreeAction extends ActionSupport {
public Category getTreeROOtNode() {
return Category.getById(1);
}
}
致此动态树状菜单的实例已经完成，可以测试了．
******************************************************************************
3.动态Ajax树状菜单:
地址栏访问方法:http://127.0.0.1:8080/study3/tree/showDynamicAjaxTreeAction.action
具体需要如下文件:
动态树状菜单的显示页面:treeExampleAjaxDynamic.jsp,
dojo辅助文件treeExampleAjaxDynamic.ftl,动态Action类文件
ShowAjaxDynamicTreeAction.java,DynamicTreeSelectAction.java(此文件同上)
******************************************************************************
动态Ajax树状菜单的action类文件
******ShowAjaxDynamicTreeAction.java******************************************
package com.zhang.study3;
import com.zhang.study3.Category;
import com.opensymphony.xwork2.ActionSupport;
public class ShowAjaxDynamicTreeAction extends ActionSupport {
private int nodeId = 1;
public Category getCategory() {
return Category.getById(nodeId);
}
public int getNodeId() {
return nodeId;
}
public void setNodeId(int nodeId) {
this.nodeId = nodeId;
}
}
******************************************************************************
显示Ajax树状菜单的.jsp页面
*****treeExampleAjaxDynamic.jsp***********************************************
<%@ page language="java" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sx" uri="/struts-dojo-tags"%>
<Html>
<head>
<title>Showcase - UI Tag Example - Tree Example (Dynamic)</title>
<sx:head />
</head>
<body>
<script language="javaScript" type="text/javascript">
dojo.event.topic.subscribe("treeSelected", function treeNodeSelected(node) {
dojo.io.bind({
url: "<s:url value='/tree/dynamicTreeSelectAction.action'/>?nodeId="+node.node.widgetId,
load: function(type, data, evt) {
var divDisplay = dojo.byId("displayId");
divDisplay.innerHtml=data;
},
mimeType: "text/Html"
});
});
</script>
<s:url var="nodesUrl" namespace="/tree" action="getNodes" />
<div style="float: left; margin-right: 50px;">
<sx:tree id="tree" href="%{#nodesUrl}"
treeSelectedTopic="treeSelected" />
</div>
<div id="displayId">
Please click on any of the tree nodes.
</div>
</body>
</Html>
******************************************************************************
辅助生成Ajax树状菜单的.ftl文件，此文件是从官方Struts2的实例包struts2-showcase-2.1.2
中找到复制到项目中的，你也可以按以下代码用记事本保存一个此文件．
****treeExampleAjaxDynamic.ftl************************************************
[
<#list category.children as node>
{
label: '${node.name}',
id: '${node.id}',
hasChildren: ${(node.children.size() > 0)?string}
},
</#list>
]
******************************************************************************
显示Ajax的Action类文件
***ShowAjaxDynamicTreeAction.java**********************************************
package com.zhang.study3;
import com.zhang.study3.Category;
import com.opensymphony.xwork2.ActionSupport;
public class ShowAjaxDynamicTreeAction extends ActionSupport {
private int nodeId = 1;
public Category getCategory() {
return Category.getById(nodeId);
}
public int getNodeId() {
return nodeId;
}
public void setNodeId(int nodeId) {
this.nodeId = nodeId;
}
}
******************************************************************************
致此动态Ajax树状菜单的实例已经完成，可以测试了．
需要注意的是后两种动态树状菜单在地址栏访问时必须以action的方式来访问，而且在以上两种地址栏中
的"/tree"中在struts.xml中配置的命名空间的值即: namespace="/tree"如果输入的是相应的.jsp文件来访问，将不会成功出现想要的结果．
其实以上两个动态菜单的实例还可以进一步扩展，将提供数据的Category.java中的静态数据通过mysql或其它数据库来提供就更实用了．如果有时间我会再整理出通过数据库来提供数据的方式．
分享到：
发表评论
相关推荐
Struts2 Dojo Tree 是一个基于Struts2框架和Dojo JavaScript库的组件，用于在Web应用程序中创建可交互的树形视图。这个组件允许用户以图形化的方式浏览和操作层次结构数据，例如文件系统、组织结构或者数据库中的...
总的来说，Struts2标签提供了一种高效的方式来构建Web应用程序的用户界面，尤其是当结合如Dojo这样的JavaScript库时，能够创建出复杂且交互性强的树形结构。通过学习和掌握这些技术，开发者可以创建出美观且易于管理...
Struts2提供了一种模型驱动的开发方式，通过Action类处理用户请求，并通过配置文件定义这些Action与视图（JSP页面）之间的映射。它还引入了拦截器（Interceptor）的概念，允许在Action执行前后插入自定义逻辑，如...
Struts2的标签库不仅限于核心库，还可以通过插件机制添加第三方标签库，如Struts2-dojo-plugin、Struts2-jquery-plugin等，这些插件提供了丰富的UI组件，如日期选择器、下拉树等。 总结，Struts2标签库是其强大功能...
4. **struts2-dojo-plugin.jar**：这个插件提供了与Dojo JavaScript库的集成，帮助开发者创建富客户端的Web应用，提供诸如日期选择器、下拉树、滑块等交互控件。 5. **struts2-spring-plugin.jar**：如果项目使用...
8. **定义Action的三种方式和获取Servlet对象**： - 实现`Action`接口。 - 继承`ActionSupport`类。 - 自定义方法（如`execute()`）。 获取Servlet对象的方法： - 低耦合：`ActionContext.getContext()....
在本项目中，我们将探讨如何使用Ajax、Struts2框架以及Dojo库来动态地从数据库中获取数据并生成树型菜单。这个功能常见于网站的导航系统，允许用户以层级结构浏览和操作数据。 首先，`Ajax`（Asynchronous ...
这样做是因为标签在处理动态树时，需要指定rootNode、nodeIdProperty、nodeTitleProperty和childCollectionProperty等属性，以便于生成树形结构。 接下来，我们需要一个Action类来处理请求并返回树形结构的数据。这...
它支持静态和动态两种方式加载数据，并且提供了丰富的配置选项以满足不同的需求。 ##### Tree标签基本语法 ```xml blankIconSrc="..." childCollectionProperty="..." collapsedNotifyTopics="..." ...
8. **获取Servlet对象的三种方式** - **耦合方式**：通过`servletActionContext.getRequest()`。 - **解耦方式**：使用`ActionContext.getContext().get("request")`。 - **实现接口**：实现`servletRequestAware...
标题中的“Java, AJAX树”指的是使用Java编程语言和AJAX（Asynchronous JavaScript and XML）技术来实现的一种交互式树形结构。这种树形结构通常用于网页应用中，允许用户无需刷新整个页面即可动态更新和操作数据。...
综上所述，dtree是Java Web开发中构建动态树形菜单的一种常见方法，它结合了Struts框架的服务器端处理能力和JavaScript的客户端交互能力，为用户提供直观且灵活的操作方式。正确理解和运用dtree，能够提升Web应用的...
Java开源AJAX框架是开发Web应用时常用的工具，它们提供了便捷的方式来实现异步JavaScript和XML（AJAX）技术，从而提升用户体验，减少页面刷新。以下是一些流行的Java开源AJAX框架的详细介绍： 1. **DWR (Direct Web...
JCaptcha4Struts2 是一个 Struts2的插件，用来增加验证码的支持，使用时只需要用一个 JSP 标签 (<jcaptcha:image label="Type the text "/> ) 即可，直接在 struts.xml 中进行配置，使用强大的 JCaptcha来生成验证码...
JCaptcha4Struts2 是一个 Struts2的插件，用来增加验证码的支持，使用时只需要用一个 JSP 标签 (<jcaptcha:image label="Type the text "/> ) 即可，直接在 struts.xml 中进行配置，使用强大的 JCaptcha来生成验证码...
JCaptcha4Struts2 是一个 Struts2的插件，用来增加验证码的支持，使用时只需要用一个 JSP 标签 (<jcaptcha:image label="Type the text "/> ) 即可，直接在 struts.xml 中进行配置，使用强大的 JCaptcha来生成验证码...
JCaptcha4Struts2 是一个 Struts2的插件，用来增加验证码的支持，使用时只需要用一个 JSP 标签 (<jcaptcha:image label="Type the text "/> ) 即可，直接在 struts.xml 中进行配置，使用强大的 JCaptcha来生成验证码...
JCaptcha4Struts2 是一个 Struts2的插件，用来增加验证码的支持，使用时只需要用一个 JSP 标签 (<jcaptcha:image label="Type the text "/> ) 即可，直接在 struts.xml 中进行配置，使用强大的 JCaptcha来生成验证码...
JCaptcha4Struts2 是一个 Struts2的插件，用来增加验证码的支持，使用时只需要用一个 JSP 标签 (<jcaptcha:image label="Type the text "/> ) 即可，直接在 struts.xml 中进行配置，使用强大的 JCaptcha来生成验证码...
JCaptcha4Struts2 是一个 Struts2的插件，用来增加验证码的支持，使用时只需要用一个 JSP 标签 (<jcaptcha:image label="Type the text "/> ) 即可，直接在 struts.xml 中进行配置，使用强大的 JCaptcha来生成验证码...