Remote Form(遠(yuǎn)程表單)最大的特點(diǎn)就是可以不用刷新頁(yè)面而進(jìn)行提交.
wiki翻譯如下:
遠(yuǎn)程表單允許提交表單但是不刷新頁(yè)面. 表單提交的結(jié)果可以設(shè)置為任何頁(yè)面上的元素的內(nèi)容.
為了讓表單具有ajax功能, 必須使用ww:form, 指定模板主題為 "ajax". 另外, 必須配合 ww:submit 才能一起工作. ww:submit組件相關(guān)的AJAX屬性包括:
| 名稱(chēng) | 描述 |
| resultDivId (required) |
要存放結(jié)果的Html元素的id (可以是表單的id或者頁(yè)面上的任何id) |
| notifyTopics |
表單提交后,對(duì)哪些Topic進(jìn)行事件激發(fā),可以多個(gè),用逗號(hào)分割 |
| afterLoading |
表單提交后要執(zhí)行的Javascript代碼 |
Remote Form是由Form和Submit標(biāo)簽協(xié)作運(yùn)行的,它有三個(gè)特性:
1.可以用提交后獲取的內(nèi)容替換某個(gè)id元素的內(nèi)容
2.提交后可以觸發(fā)事件
3.提交后可以執(zhí)行一段JavaScript
我們來(lái)看第一個(gè)例子:
<div id='two' style="border: 1px solid yellow;"><b>initial content</b></div>
<ww:form id='theForm2' cssStyle="border: 1px solid green;"
action='/AjaxRemoteForm.action' method='post' theme="ajax">
<input type='text' name='data' value='WebWork User'>
<ww:submit value="GO2" theme="ajax" resultDivId="two" />
</ww:form> |
可以看到,form必須使用ajax模板,submit標(biāo)簽也是使用ajax模板(或者具有ajax模板功能的自定義模板),只有使用ajax模板,才具有提交不刷新頁(yè)面的效果,否則就是普通的表單提交了.
form沒(méi)有特殊的屬性,主要是submit的屬性resultDivId,指定目標(biāo)id為"two",這個(gè)id可以是頁(yè)面上的任何一個(gè)元素的id,當(dāng)然也可以是表單本身.點(diǎn)擊提交按鈕后,id為"two"的元素的內(nèi)容被替換為表單提交的結(jié)果內(nèi)容.
另外,submit還有另外2個(gè)屬性,其中之一是onLoadJS,如果在submit的屬性中指定onLoadJS,例如
<ww:submit value="GO4" theme="ajax" onLoadJS="alert('form submitted');"/>
則表單提交后會(huì)執(zhí)行相應(yīng)的JavaScript代碼.
另外一個(gè)屬性是notifyTopics,可以觸發(fā)Topic為指定屬性的事件,例如
<ww:div id="once" theme="ajax" cssStyle="border: 1px solid yellow;"
href="/AjaxTest.action" delay="1000"
listenTopics="scud1" loadingText="loading...">Initial Content</ww:div>
<br><br>
<ww:form id='theForm2' cssStyle="border: 1px solid green;"
action='/AjaxRemoteForm.action' method='post' theme="ajax">
<input type='text' name='data' value='WebWork User'>
<ww:submit value="GO2" theme="ajax" notifyTopics="scud1" />
</ww:form> |
提交表單將會(huì)觸發(fā)監(jiān)聽(tīng)Topic為"scud1"的控件的事件,它們會(huì)重載自身的內(nèi)容.可以參考前面Div 標(biāo)簽的說(shuō)明.
注:目前beta版本不支持在Internet Explorer上運(yùn)行,可以在FireFox下正常運(yùn)行.(2005-9-16cvs上最新的版本可以運(yùn)行在ie下了)
除經(jīng)特別注明外,本文章版權(quán)歸JScud Develop團(tuán)隊(duì)或其原作者所有.
轉(zhuǎn)載請(qǐng)注明作者和來(lái)源. scud(飛云小俠) 歡迎訪(fǎng)問(wèn) JScud Develop