结合Struts和Ajax

学了一段时间Ajax,感觉ajax本身是蛮简单的,它不是框架,应该算是一种模式吧,只不过它本身根据不同的应用又可以划分为多种模式.但是总的思路还是差不多.复杂的地方我觉得还在于DHTML这里,因为各个浏览器都有不同之处,所以想做到支持各种浏览器就很麻烦了,另外,还有好多人的浏览器版本还比较低,写出比较漂亮的象桌面程序一样的组件也复杂(这个还好有许多开源的框架)...加上开发的方式从服务器端思考问题转化到了从客户端思考问题,写AJAX的WEB程序还是很有挑战性的.也很重要:)

这两天做了个小实验,把Struts和Ajax结合起来做了一个Table.


现在它的功能非常有限，只是用Ajax技术取得数据，然后表格支持排序，点某行高亮显示.

1.Server
服务器这边只有一个ViewAction,它负责从DataBaseService取得数据传给View.jsp.因为ajax,所以View.jsp并不是给用户看的,而是由客户端的XMLHttp Object悄悄调用这个Action来得到View.jsp中的数据.我用的是XML格式的数据,View.jsp最后的数据如下:

<persons>

<person id="0" name="Andy">
<department>IBM</department>
<salary>12110.5</salary>
</person>

<person id="1" name="Jacky">
<department>MicroSoft</department>
<salary>11000.4</salary>
</person>

<person id="2" name="Rey">
<department>BEA</department>
<salary>13000.3</salary>

</person>

</persons>

View.jsp的代码这样写的:

<%...@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean" %>
<%...@ taglib uri="/WEB-INF/struts-html.tld" prefix="html" %>
<%...@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %>

<logic:present name="viewForm" property="result">
<persons>
<logic:iterate id="person" name="viewForm" property="result">
<bean:define id="id" name="person" property="id"/>
<bean:define id="name" name="person" property="name"/>
<person id="<%=id%>" name="<%=name%>">
<department><bean:write name="person" property="department"/></department>
<salary><bean:write name="person" property="salary"/></salary>
</person>
</logic:iterate>
</persons>
</logic:present>

2.Client
客户端程序的过程蛮简单的，如下所示:


网上有个struts和ajax结合的例子,因为他每次drawTable时都需要调用retrieveURL方法，这样太浪费资源了,可能是原作者的本意是让他的例子尽可能简单吧.我写的demo每次只需要连接Server一次,然后排序都是在本地完成的.

这个例子服务器端用XML格式来发送数据,浪费了不少字节来传送不必要的字段,Json在这方面就比较好一点.总的来说都是各有利弊吧.

实现动态的表格是利用DOM来完成的.完成这么简单的小table就花了200行JavaScript代码,有时间我就加入更复杂的功能,比如完成CRUD.

代码下载:

运行:
把strutsajax.war后,直接放入Tomcat webapps文件夹中就可以运行了.
在浏览器输入:
http://localhost:8080/strutsajax/pages/ajaxTable.html

如果要查看服务器发送给XmlHttp Object的数据,可以输入:
http://localhost:8080/strutsajax/ViewAction.do
然后查看源代码.