Remote Form(远程表单)最大的特点就是可以不用刷新页面而进行提交.
wiki翻译如下:
远程表单允许提交表单但是不刷新页面. 表单提交的结果可以设置为任何页面上的元素的内容.
为了让表单具有ajax功能, 必须使用ww:form, 指定模板主题为 "ajax". 另外, 必须配合 ww:submit 才能一起工作. ww:submit组件相关的AJAX属性包括:
| 名称 | 描述 |
| resultDivId (required) |
要存放结果的Html元素的id (可以是表单的id或者页面上的任何id) |
| notifyTopics |
表单提交后,对哪些Topic进行事件激发,可以多个,用逗号分割 |
| afterLoading |
表单提交后要执行的Javascript代码 |
Remote Form是由Form和Submit标签协作运行的,它有三个特性:
1.可以用提交后获取的内容替换某个id元素的内容
2.提交后可以触发事件
3.提交后可以执行一段JavaScript
我们来看第一个例子:
<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标签也是使用ajax模板(或者具有ajax模板功能的自定义模板),只有使用ajax模板,才具有提交不刷新页面的效果,否则就是普通的表单提交了.
form没有特殊的属性,主要是submit的属性resultDivId,指定目标id为"two",这个id可以是页面上的任何一个元素的id,当然也可以是表单本身.点击提交按钮后,id为"two"的元素的内容被替换为表单提交的结果内容.
另外,submit还有另外2个属性,其中之一是onLoadJS,如果在submit的属性中指定onLoadJS,例如
<ww:submit value="GO4" theme="ajax" onLoadJS="alert('form submitted');"/>
则表单提交后会执行相应的JavaScript代码.
另外一个属性是notifyTopics,可以触发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> |
提交表单将会触发监听Topic为"scud1"的控件的事件,它们会重载自身的内容.可以参考前面Div 标签的说明.
注:目前beta版本不支持在Internet Explorer上运行,可以在FireFox下正常运行.(2005-9-16cvs上最新的版本可以运行在ie下了)
除经特别注明外,本文章版权归JScud Develop团队或其原作者所有.
转载请注明作者和来源. scud(飞云小侠) 欢迎访问 JScud Develop