初析Struts2中的Ajax開發實例

作者：小瓶子 2011-07-18 14:43:40

Ajax作為WEB開發中的明星，自有其性能和開發上的優勢。本文將給大家簡單介紹Struts2中的Ajax開發實例，希望對大家有所幫助。

　　Web2.0的隨波逐流，Ajax那是大放異彩，Struts2框架自己整合了對Ajax的原生支持（struts 2.1.7+，之前的版本可以通過插件實現），框架的整合只是使得JSON的創建變得異常簡單，并且可以簡單的融入到Struts2框架中，當然這只是在我們需要JSON的時候才會顯得流光溢彩。

　　首先不談Struts2的原生支持，我們自己寫一個ajax示例，使用異步請求，直接請求action動作：

　　InfoAction.java

packagecn.codeplus.action;importcom.opensymphony.xwork2.ActionSupport;  
publicclassInfoAction extendsActionSupport {
privatestaticfinallongserialVersionUID =1359090410097337654L;  
publicString loadInfo() {returnSUCCESS;  
　　}  
　　}

InfoAction僅僅是簡單的返回"success"。

　　index.jsp

　　<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
　　<html> 
　　<head>　　<base href="<%=basePath%>"> 
　　<title>獲取</title> 
　　<script type="text/javascript"src="js/jquery.js"> 
　　</script> 
　　<script type="text/javascript"> 
　　functionloadInfo() {  
　　$("#info").load("loadInfo");  
　　}</script> 
　　</head> 
　　<body> 
　　<input type="button"value="獲取"id="btnGet"onclick="loadInfo()"/> 
　　<div id="info"></div> 
　　</body> 
　　</html>

　　index.jsp包含一個按鈕，點擊按鈕則會觸發異步請求事件。

　　struts.xml

　　<package name="ajaxDemo"extends="struts-default"> 
　　<action name="loadInfo"class="cn.codeplus.action.InfoAction"method="loadInfo"> 
　　<result name="success">/info.jsp</result> 
　　</action> 
　　</package>

　　可見上面的異步請求的結果將會是加載info.jsp，info.jsp只是一個簡單網頁，不列出了。

　　運行效果如下：

單擊獲取之后：

此時的頁面源代碼：

　　<div>標簽中嵌套了<title>標簽，不符合規范，其實我們只要吧info.jsp寫的沒有<title>之類的標簽，就不會出現這種情況了。

　　以上說的異步請求僅適用于請求單個文件，如果我們請求的是動態數據，并且數據需要以JSON格式返回，上面的方法將會顯得力不從心，這是struts2的原生支持就得出馬了。

　　使用struts2的ajax，必須在項目中引入struts2-json-plugin-2.2.1.jar，在版本2.1.7+都一句綁定在struts2發行包里面了（之前的版本可以在這下載）。記住，要引入struts2-json-plugin-2.2.1.jar。

　　這次我們使用另一個例子，模擬加載評論：

　　dto對象，Comment.java

packagecn.codeplus.po;  
publicclassComment {  
privatelongid;privateString nickname;
privateString content;publiclonggetId() {returnid;  
　　}  
publicvoidsetId(longid) {
this.id =id;  
　　}  
publicString getNickname() {returnnickname;  
　　}  
publicvoidsetNickname(String nickname) {
this.nickname =nickname;  
　}  
publicString getContent() {returncontent;  
　　}  
publicvoidsetContent(String content) {
this.content =content;  
　　}  
　　}

　　新的InfoAction.java　

packagecn.codeplus.action;  
importjava.util.ArrayList;importjava.util.List;  
importcn.codeplus.po.Comment;  
importcom.opensymphony.xwork2.ActionSupport;  
publicclassInfoAction extendsActionSupport {  
privatestaticfinallongserialVersionUID =1359090410097337654L;  
privateList<Comment>comments =newArrayList<Comment>();//沒getter and setter方法的屬性不會被串行化到JSON  
　　@SuppressWarnings("unused")  
privateString title;//！！！使用transient修飾的屬性也會被串行化到JSONprivatetransientString content;publicString loadInfo() {  
　　title="123木頭人";  
　　content="你是木頭人，哈哈。";  
　　loadComments();returnSUCCESS;  
　　}/*** 加載留言信息*/  
　　privatevoidloadComments() {  
　　Comment com1 =newComment();  
　　com1.setContent("很不錯嘛");  
　　com1.setId(1);  
　　com1.setNickname("納尼");  
　　Comment com2 =newComment();  
　　com2.setContent("喲西喲西");  
　　com2.setId(2);  
　　com2.setNickname("小強");  
　　comments.add(com1);  
　　comments.add(com2);  
　　}publicList<Comment>getComments() {returncomments;  
　　}publicvoidsetComments(List<Comment>comments) {this.comments =comments;  
　　}publicstaticlonggetSerialversionuid() {returnserialVersionUID;  
　　}publicString getContent() {returncontent;  
　　}publicvoidsetContent(String content) {this.content =content;  
　　}  
　　}  
　　index.jsp還是那個index.jsp。(*^__^*) 嘻嘻……  
　　struts.xml變化挺大：  
　　<package name="ajaxDemo"extends="json-default"> 
　　<action name="loadInfo"class="cn.codeplus.action.InfoAction"method="loadInfo"> 
　　<result name="success"type="json"></result> 
　　</action> 
　　</package>

　　在struts.xml中：

　　首先，package extends由struts-default轉變為json-default，這是必須的，只用在json-default中才包含下面使用的result type為 json。

　　然后就是result類型需顯示指明為json，result標簽內，無需指明視圖指向的界面。

　　***就是運行結果啦：

　　點擊“獲取”按鈕之后：

　　可見comments對象和content對象都被串行化到JSON數據了，不知道是不是版本的問題，很多資料都說使用transient修飾的屬性不會被串行化到JSON的。

　　為了使content對象不被串行化到JSON，在不能舍棄其getter setter方法的時候，我們可以這樣在content的getter方法上面加上注解：@JSON(serialize=false)

　　...  
　　@JSON(serialize=false)publicString getContent() {returncontent;  
　　}publicvoidsetContent(String content) {this.content =content;  
　　}  
　　...

　　這時的結果如下：

　　@JSON和json類型的result都還有很多可選項，無非就是串行化誰，不串行化誰，返回數據的MIME類型，讀者可以自行參考相關文檔。

　　獲取到JSON數據了，下一步就是在前臺使用js處理JSON數據了，本人JS不精，喜歡使用jQuery解析，如有興趣，且聽下回分解jQuery解析JSON數據。

原文鏈接：http://www.cnblogs.com/codeplus/archive/2011/07/18/2109316.html

【編輯推薦】

理解JSON：3分鐘課程輕松搞定
JSONP跨域原理和jQuery.getJSON用法
在PHP語言中使用JSON
Jackson框架輕易轉換JSON
Ajax和WEB服務數據格式：JSON JSONP

責任編輯：彭凡來源：博客園

JSON 模擬加載初析