Struts2+FreeMarker中利用plainText處理Ajax的一個技巧
Posted on 2010-11-10 15:43 寒武紀 閱讀(3100) 評論(3) 編輯 收藏 所屬分類: Struts2 項目中使用了FreeMarker做為視圖技術,相對來說因為freemarker在視圖上有一些邏輯處理功能,某些地方就顯得比較方便,特別是macro的使用,當然也不是說JSP就沒有這個功能,只是以前用JSP寫起來沒有這么順手。
那么遵從前臺開發的一些基本原則,FTL(指freemarker模板文件)、CSS、JS都可以分得比較清晰。按照以前的技巧,在做Ajax請求的時候,都是前臺用JS框架(例如jquery)發送請求,Server端處理后用JSON結果返回。用struts2,到現在已經是2.2.1版本了,都覺得很方便!一般都是加上struts-json的Plugin來響應JSON的結果。
老是覺得麻煩的地方在于:JSON是純數據的組織形式,在Server處理完后,要響應頁面,得先組織成json,到了頁面,響應得到了json,又得取出來,動態添加到DOM中的某個地方;數據添加的同時,還有可能得使用js對樣式進行一些效果渲染。總體來說,這就使得前臺的js有點羅嗦,比如常見的就要append(html),這些html是用js字符串生成的,看著感覺很不舒服。
發現struts2有一個特殊的類型叫:plainText,可以把type類型定義為它,這樣頁面響應獲取得到的就是源代碼樣式的內容。這個功能大概就是為了給那些需要返回源代碼的頁面使用的。那么換個思路就是說,這返回的type就可以針對上面提出問題中,解決了已經組織好數據和樣式的內容。返回的內容不僅包含了數據,也包含了樣式,和你直接返回一個HTML是一樣,不過一般我們都需要動態生成html。把結果直接嵌入在HTML中,就可以顯示出來,不再需要用js進行組織。利用這個特點,做了個測試。發現行得通!
1. 首先,配置struts.xml文件,添加如下代碼:
<package name="pt" extends="struts-default">
<action name="test" class="test.TestAction">
<result type="plainText">
<param name="location">/test.ftl</param>
<param name="charSet">GBK</param>
</result>
</action>
</package>
注意到了2.2.1版本,原來的plaintext寫法不知道從哪個版本開始已經不支持了,要有大寫T開頭,plainText,一個小細節,免得啟動時老是報錯。
2. Action的代碼
public class TestAction extends ActionSupport {
private String msg;
public String getMsg() {
return msg;
}
public void setMsg(String msg) {
this.msg = msg;
}
@Override
public String execute() throws Exception {
setMsg("我是Test");
Configuration cfg = new Configuration();
cfg.setServletContextForTemplateLoading(ServletContextUtil.getContext(), "/template");
Template t = cfg.getTemplate("test.ftl");
ServletContextUtil.getResponse().setContentType("text/html;charaset=" + t.getEncoding());
Writer out = ServletContextUtil.getResponse().getWriter();
Map root = new HashMap();
root.put("msg", getMsg());
t.process(root, out);
return null;
}
}
這是臨時隨便寫的,變量大概在正式項目中不會這樣定義,這只是一個測試而已。這里要注意,不要返回SUCCES,因為那樣返回的是源文件,沒有填充入數據的ftl文件,到了前臺也沒用。所以這里有點小麻煩,必須用Freemarker的API,把固定的模板,用數據填充后,用out寫出,最后return null即可!
3. 下面是ftl文件
<div style="color:red;">This is a plainText: ${msg}</div>
這樣前臺接收到的,就是這個經過填充和渲染后的ftl頁面,和正常的html一樣。你可以把這個頁面做得足夠復雜。在需要嵌入的頁面上,用jquery之類的調用后放入DOM中即可以。
比如下面這樣的,把獲取得到的內容,填充入id為myDiv的DOM節點中。
$("#myDiv").load("test.action");
話說回來,也不是所有地方都建議這樣,有些地方,比如ajax填充一個下拉列表,或是僅僅列出一些簡單的數據,就不建議這么大費周章。直接用JSON處理更來得簡單。這個技巧適用的場景是那些沒有iframe架構的頁面,又需要ajax響應局部的具有一些組織形式的內容。如果你頁面都是include方式來進行劃分,又想可以Aajx引入一個比較復雜的頁面,也許這種思路可以省掉很多麻煩。具體的應用還需要進一步的實踐!
剛進場的時候戲就落幕
那么遵從前臺開發的一些基本原則,FTL(指freemarker模板文件)、CSS、JS都可以分得比較清晰。按照以前的技巧,在做Ajax請求的時候,都是前臺用JS框架(例如jquery)發送請求,Server端處理后用JSON結果返回。用struts2,到現在已經是2.2.1版本了,都覺得很方便!一般都是加上struts-json的Plugin來響應JSON的結果。
老是覺得麻煩的地方在于:JSON是純數據的組織形式,在Server處理完后,要響應頁面,得先組織成json,到了頁面,響應得到了json,又得取出來,動態添加到DOM中的某個地方;數據添加的同時,還有可能得使用js對樣式進行一些效果渲染。總體來說,這就使得前臺的js有點羅嗦,比如常見的就要append(html),這些html是用js字符串生成的,看著感覺很不舒服。
發現struts2有一個特殊的類型叫:plainText,可以把type類型定義為它,這樣頁面響應獲取得到的就是源代碼樣式的內容。這個功能大概就是為了給那些需要返回源代碼的頁面使用的。那么換個思路就是說,這返回的type就可以針對上面提出問題中,解決了已經組織好數據和樣式的內容。返回的內容不僅包含了數據,也包含了樣式,和你直接返回一個HTML是一樣,不過一般我們都需要動態生成html。把結果直接嵌入在HTML中,就可以顯示出來,不再需要用js進行組織。利用這個特點,做了個測試。發現行得通!
1. 首先,配置struts.xml文件,添加如下代碼:








2. Action的代碼






















3. 下面是ftl文件

比如下面這樣的,把獲取得到的內容,填充入id為myDiv的DOM節點中。

剛進場的時候戲就落幕