struts2之form標籤theme屬性詳解

http://hi.baidu.com/zhouwei9960/blog/item/6f9dec674123b62cab184cc4.html 處轉載

struts2中theme屬性包括xhtml,html,simple,ajax 。默認是xhtml

theme:設置struts2標籤的主題,默認爲xhtml。 theme=xhtml時:會默認額外生成tr,td。 theme=simple時:就生成標籤所對應的html標籤形式。

在默認情況下,表單元素是分佈在不同行的。如下代碼:
<s:form action="login2"> <s:textfield label="用戶名" name="username"/> <s:password label="密碼" name="password"/> <s:submit label="提交"/> </s:form>
我們看着以上的代碼跟HTML的差不了多少,但是因爲struts2表單默認將表單內的每一個元素都分在單獨的一行,label屬性就如同我們在HTML 中在<input type="text"/>前面的文字標籤一樣。如果我們不想讓它自動換行,那就應該寫成如下格式:

<s:form action="login2" theme="simple"> <s:textfield label="用戶名" name="username"/> <s:password label="密碼" name="password"/> <s:submit label="提交"/> </s:form>

但在設置theme="simple"後,表單元素的label屬性將失效,這時我們就得在表單元素前面加入想用label顯示的文字。如:

<s:form action="login2" theme="simple"> 用戶名:<s:textfield label="用戶名" name="username"/> 密碼:<s:password label="密碼" name="password"/> <s:submit label="提交"/> </s:form>

此時顯示的爲將不在是label中的值,而是顯示文本框前面的文字,按鈕則顯示它原來的默認值:sbumit。

以下爲擴充知識: 1. 模板目錄->主題目錄->主題(模板文件) 這是模板/主題的目錄組織方式。以實際爲例,打開 struts2-core-2.x.x.jar 可以看到裏面有一個 template,在 template 下有5個目錄 ajax、css_xhtml、simple、xhtml 和 archive,其中前四個分別是 ajax、css_xhtml、simple、xhtml 主題的目錄,每個主題目錄中有各自的模板文件,主要是 ftl 文件,還有 css 和 js 文件。最後一個 archive 是歸檔的主題目錄,其下又有 ajax、simple、xhtml、模板文件是 .vm 文件。由此可知 Struts2 大力推薦的模板語言是 FreeMarker,而不是 Velocity,以後要好好看看 FreeMarker,只知道 FreeMarkder 更 XML 化。
2. 上面看到模板目錄名是 template,是 struts2-core-2.x.x.jar 中,其實目錄名是由 struts.ui.templateDir 常量來指定的,只是默認值是 template。意味着 Struts 2 從 Web 應用的 template 目錄或 CLASSPATH 的 template 目錄(包) 中依次加載特定的模板文件。
3. 比如我們使用一個 select 標籤,且指定主題爲 xhtml,則加載模板文件的順序爲 (1) Web 應用/template/xhmlt/select.flt (2) CLASSPATH/template/xhtml/select.ftl。Struts2 默認是用的 FreeMarkder 模板技術,可設置常量 struts.ui.templateSuffix 來改變默認的模板技術,可選值有 ftl、vm、jsp。但是對於 vm 和 jsp 要自己提供完整的實現,Struts2 可沒幫你做這些。
4. 有時候我們想要自定義主題,如你希望輸入框前的標籤顯示紅顏色,你不想要校驗錯誤提示在輸入框正上方而是右邊。當然你可以修改 struts2-core-2.x.x.jar 中 template 下某個主題的模板文件,或拷一份到 Web 應用目錄的 template 目錄修改要定製的模板,這樣做總有些不爽。Struts2 還支持兩種更靈活的主題定製方式。包裝和繼承現有主題,可以同時使用。 最簡單的主題定製方式是利用主題模板的加載優先級,把自定義的模板文件放在優先級高的目錄,比如放一個 text.ftl 在 WEB-INF/classes/template/xhtml/ 目錄下,它將覆蓋掉 struts2-core-2.x.x.jar 裏的 template/xhtml/text.ftl 的定義。
5. 先看一個包裝的例子,在 xhtml 下的 combobox.ftl 的內容如下: <#include "/${parameters.templateDir}/${parameters.theme}/controlheader.ftl" />

<#include "/${parameters.templateDir}/simple/combobox.ftl" /> <#include "/${parameters.templateDir}/xhtml/controlfooter.ftl" /><#nt/> 它就是對 simple/combobox.ftl 的基礎上包裝上一個 controlheader.ftl 和一個 controlfooter.ftl,包裝的侷限性是你仍然是要爲每一個 UI 組件提供單獨模板文件,即全套的。 和設計模式中的包裝(裝飾)模式如出一轍,如 BufferedInputStream 包裝了 InputStream,但在 BufferedInputStream 提供了全套的和 InputStream 一樣的操作方法。
6. 再說繼承來自定義主題,如果簡單改變個別 UI 的風格,繼承就是最爲高效的了。此繼承與 Java 的繼承(即extends) 也是一馬事。要改變或要新加的用自己定義的,其他的延用父主題的。舉個例子,自定義一個名爲 custom 的主題繼承自 xhtml,只改變 select 標籤的風格,你要做的就是編輯自己的一個 select.ftl 放在 WEB-INF/classes/template/custom 下,並在此目錄下放一文件 theme.properties,內容是: #指定該主題以 xhtml 爲基礎進行擴展 parent=xhml
使用可指定給 UI 標籤,例如 <s:form name="aa" theme="custom" ...,效果就會是 form 下的 select 使用了在 custom 目錄下自定義的 select.ftl,其他的直接使用父主題 xhtml 中的模板文件。Struts2 提供的 ajax 主題就是繼承自 xhtml 主題的。
7. 簡單說一下 Struts2 的內建主題,包括 simple、xhtml、css_xhtml 和 ajax。simple 主題不用多說,比Struts1 的 html 標籤還弱些,只對應簡單的 html 元素,不生成額外內容。xhtml 是默認主題,是對 simple 主題的包裝和擴展(也就是繼承),該主題下有一個 head.ftl 用來導入 javascript 類庫(如 dojo)。xhtml 在 simple 的基礎上增加了以下特性: 1) 針對 HTML 標籤(如 textfield和select標籤) 使用標準的兩列表格佈局 2) 每個 HTML 標籤有 label 屬性,默認左邊顯示,可通過 labelposition 屬性設定位置 3) 自動輸出後臺校驗錯誤或 javascript 前端校驗錯誤
8. 繼續 Struts2 的內建主題的話題。css_xhtml 主題是對 xhtml 的擴展,顯示是加入了 css 樣式控制特性。ajax 主題是對 xhtml 主題的擴展,在 xhtml 主題的每個標籤增加了 ajax 的支持(以 Djoj 和 DWR 爲基礎)。所增 Ajax 特性有: 1) Ajax 方式的客戶端校驗 2) 遠程表單的異步提交 3) 高級 div 標籤,允許局部更新 4) 高級 a 標籤,允許動態加載並執行遠端的 javascript 代碼。 5) 提供支持 ajax 的 tabbedPanel 6) 提供“富客戶端” 模型的 pub-sub 事件模型
9. 先前有網友問過我,他用了 Struts2 的校驗,但是錯誤輸出是在輸入框的上方,但希望錯誤信息是顯示在輸入框的右方,該如何做。當時我只告訴了他要修改模板文件,也只是大概告訴了他是在某個 template 目錄下的一個 ftl 文件,因那時具體操作自己也不太清楚。現在知道了線索,但實際修改還是很麻煩的。 輸入框 <s:textfield .../> 默認是用的 xhtml/text.flt 模板,text.ftl 包裝了 smple/text.ftl,錯誤信息可以追溯發現是在 controlheader-core.ftl 中定義顯示的,所以你可以把 xthml/text.ftl 和 controlheader-core.ftl 拷到 WEB-INF/classes/template/xhtml 目錄中進行修改,WEB-INF/classes/template/xhtml 中的模板文件是優先於 struts2-core-2.x.x.jar 裏的 template/xhtml 目錄中的模板文件加載。
10. 看有些地方只籠統介紹說:所有表單元素都存在一個特殊的屬性:form,這個屬性引用元素所在表單,通過該屬性實現表單元素與表單間的交互,例如可通過 ${parameters.form.id} 訪問表單的 ID。對這句話我只是感到一頭霧水,查看像 <s:textfield .../> 等標籤並無 form 屬性,用 <s:textfield value="${parameters.form.id}" name="aa"/> 也看不到輸出所在表單的 ID。去網上找找,才知道前面那句話有出入,其實說的是在主題模板文件裏的用法,打開一些主題模板文件,如 combobox.ftl 或 controlheader-core.ftl 文件,你就能看到許多的 parameters 的表示法-- parameters.required、parameters.id。想見一下 parameters 屬性纔是根本,它代表了表單元素的屬性集,parameters 說來還有點像 this,this.id、this.form.id、this.required 等等...

在用struts2開發項目的時候發現它總是會添加一些html標籤在最終生成的html代碼中,比如說使用<s:form></s:form>標籤,此時生成的html代碼如下:
<form ...><table class="wwFormTable"></table></form>
其中藍色高亮部分是struts自動產生的,對於這些自動產生的東西有時候有用,但是對於有些項目確是不合適的,比如說我們的頁面全部不允許加入table標籤,或者需要用別的樣式單等等,此時我們就希望不要產生這些多餘的標籤。
那麼怎樣才能讓struts2不要生成這些標籤呢? 其實在struts-core-2.06.jar的包中包含了一些默認的模版文件,它們位於$ {struts-core-2.06.jar}/template下,其中有ajax,simple,xhtml等。
查看一下struts.properties,如果沒有可以查看$ {struts-core-2.06.jar}/org/apache/struts2/default.properties文件,其中有如下配置: struts.ui.theme=xhtml struts.ui.templateDir=template struts.ui.templateSuffix=ftl
這一段就是關於struts2模版的配置信息,我們可以修改struts.properties文件,將其改成 struts.ui.theme=simple struts.ui.templateDir=template struts.ui.templateSuffix=ftl
如果沒有struts.properties文件,可以修改struts.xml文件,在其中加入如下行
<constant name="struts.ui.theme" value="simple" /> <constant name="struts.ui.templateDir" value="template" /> <constant name="struts.ui.templateSuffix" value="ftl" /> 此時<s:form></s:form>標籤生成的html代碼將會是<form ...></form>。

發佈了14 篇原創文章 · 獲贊 6 · 訪問量 6萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章