在WebWork2.2中,引入了Dojo ( http://dojotoolkit.org ) 和DWR ( http://getahead.ltd.uk/dwr/ ) 兩個(gè)新的部件來支持AJAX功能.
其中主要增加的特性包括:
- Remote Div Tag -- 遠(yuǎn)程區(qū)域塊標(biāo)簽,通過異步調(diào)用獲取內(nèi)容,來動(dòng)態(tài)更新Div.可以循環(huán)更新.
- Remote A Tag --遠(yuǎn)程鏈接標(biāo)簽,點(diǎn)擊鏈接時(shí)進(jìn)行一個(gè)遠(yuǎn)程異步調(diào)用,可以動(dòng)態(tài)更新Div的內(nèi)容.
- Tabbed Panelds --選項(xiàng)卡頁面,和普通程序中的選項(xiàng)卡一樣,可以有多個(gè)選項(xiàng)頁面,每個(gè)頁面的內(nèi)容都可以設(shè)置(本地或者從遠(yuǎn)程獲取),點(diǎn)擊一個(gè)選項(xiàng)頁,切換頁面.
- Remote Form --遠(yuǎn)程表單,也就是提交但不刷新的表單,點(diǎn)擊提交按鈕,頁面不刷新,通過遠(yuǎn)程異步調(diào)用,更新目標(biāo)區(qū)域的內(nèi)容.
- Form Validation --表單校驗(yàn),在表單中的每個(gè)控件輸入數(shù)據(jù)都可以進(jìn)行即時(shí)的校驗(yàn),主要使用的是DWR.這個(gè)在前面已經(jīng)演示過了.
目前這幾個(gè)控件在IE上表現(xiàn)的都有一些問題:
- 目前Remote Form在IE下不工作,在FireFox下正常工作.
- 目前動(dòng)態(tài)刷新在IE上好像都有緩存問題,在FireFox下沒有問題.(如果在結(jié)果頁面增加清除緩存的代碼,可以解決這個(gè)問題)
因?yàn)橐郧皼]有使用過AJAX,所以后面的文字基本是把webwork wiki上的文檔翻譯一下,然后按照webwork自帶的ajax的教程使用并說明一下.
建議使用這幾個(gè)標(biāo)簽之前,了解一下Dojo的工作原理,這樣才能知其所以然.
清除緩存的代碼:
<%
response.setHeader("Pragma", "no-cache");
response.setHeader("Cache-Control", "no-cache");
response.setDateHeader("Expires", 0);
%> |
或者用html的meta來試試,不過那就包含在內(nèi)容里了.
為了使用WebWork的AJAX組件,我們需要在頁面里面根據(jù)Dojo的做法包含一些代碼,例如ajax例子里面的commonInclude.jsp文件:
|
<%@ taglib prefix="ww" uri="/webwork" %>
<!--// START SNIPPET: common-include-->
<script language="JavaScript" type="text/javascript">
// Dojo configuration
djConfig = {
baseRelativePath: "<ww:url includeParams="none" value="/webwork/dojo/"/>",
isDebug: false
};
</script>
<script language="JavaScript" type="text/javascript"
src="<ww:url includeParams="none" value="/webwork/dojo/dojo.js" />"></script>
<script language="JavaScript" type="text/javascript"
src="<ww:url includeParams="none" value="/webwork/CommonFunctions.js" />"></script>
<script language="JavaScript" type="text/javascript">
dojo.require("dojo.io.BrowserIO");
dojo.require("dojo.event.topic");
dojo.require("webwork.widgets.Bind");
dojo.require("webwork.widgets.BindDiv");
dojo.require("webwork.widgets.BindButton");
dojo.require("webwork.widgets.BindAnchor");
</script>
<!--// END SNIPPET: common-include-->
|
這個(gè)文件里面對(duì)Dojo進(jìn)行了設(shè)置,包含dojo.js,并且引入了webwork實(shí)現(xiàn)的這幾個(gè)裝飾件的代碼,在后面的每個(gè)例子中,都要包含這個(gè)文件,因此后面的介紹中將省略這個(gè)文件的介紹,要想了解更多信息,可以參考Dojo的文檔.
注:AJAX對(duì)于WebWork來說還是一個(gè)新的特性,肯定會(huì)存在一些問題,我們要努力地去開發(fā)論壇上提意見 :)
2005-9-16:remote form 最新cvs上的版本已經(jīng)可以在ie上運(yùn)行.