使用Struts实现Ajax效果

piperzero

浏览: 3471915 次
性别:
来自: 杭州

最近访客更多访客>>

handsome1234

u012363178

zhangketuan

wangyy

博主相关

博客

微博

相册

留言

关于我

文章分类

全部博客 (3796)

社区版块

存档分类

首先说，Struts提供了对Ajax的支持。他们是建立在Dojo和DWR基础之上的。其中，Dojo是开源的JavaScript工具

包。提供了丰富的组件库和页面效果.

想要在Struts2中使用这个支持，需要导入struts2-dojo-plugin-2.1.8.jar这个插件，他提供了支持。

配置完成后，在需使用的页面导入标签库

<%@taglib uri="/struts-tags" prefix="s"%> <%@taglib uri="/struts-dojo-tags" prefix="sx"%>
然后就可以使用了。下面我们来演示一个时间选择器的案例

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" contentType="text/html; charset=UTF-8"%> <%@taglib uri="/struts-tags" prefix="s"%> <%@taglib uri="/struts-dojo-tags" prefix="sx"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>My JSP 'test2.jsp' starting page</title> <sx:head/> </head> <body> <br/>---------------------时间选择器---------------------------<br/> <sx:datetimepicker value="today" name="getdate" label="时间选择器" displayFormat="yyyy-MM-dd"> </sx:datetimepicker> <br/>---------------------时间选择器---------------------------<br/> </body> </html>
效果如下

可以看到效果非常的好，但是代码非常的简单，可见Dojo的威力强大.

然后再做一个树形结构，这个在许多管理网站界面都能看见，很常用

<pre name="code" class="html"><%@ page language="java" import="java.util.*" pageEncoding="UTF-8" contentType="text/html; charset=UTF-8"%> <%@taglib uri="/struts-tags" prefix="s"%> <%@taglib uri="/struts-dojo-tags" prefix="sx"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>My JSP 'test3.jsp' starting page</title> <sx:head/> </head> <body> <sx:tree label="中国" id="1" showGrid="true" showRootGrid="true" treeSelectedTopic="treeSelected"> <sx:treenode label="山东省" id="2"> <sx:treenode label="济南市" id="3"/> <sx:treenode label="青岛市" id="4"/> <sx:treenode label="烟台市" id="5"/> <sx:treenode label="枣庄市" id="6"/> </sx:treenode> <sx:treenode label="北京市" id="7"> <sx:treenode label="东城区" id="8"/> <sx:treenode label="西城区" id="9"/> </sx:treenode> <sx:treenode label="上海市" id="10"> <sx:treenode label="黄浦区" id="11"/> <sx:treenode label="徐汇区" id="12"/> </sx:treenode> </sx:tree> </body> </html> </pre>

效果如下

分享到：