THIS IS A TEST INSTANCE. ALL YOUR CHANGES WILL BE LOST!!!!
...
To ajax enable the form, the ww:form component must be used, specifying a theme="ajax". Additionally, the ww:submit component must be used. The ajax-specific attributes of ww:submit are:
Attribute | Type | Required | Default | Description |
|---|---|---|---|---|
resultDivId | string | TRUE |
| The id of the HTML element to place the result (this can the the form's id or any id on the page |
notifyTopics | string | FALSE |
| Topic names to post an event to after the form has been submitted |
onLoadJS | string | FALSE |
| Javascript code that will be executed after the form has been submitted. The format is onLoadJS='yourMethodName(data,type)'. NOTE: the words data and type must be left like that if you want the event type and the returned data. |
The remote form has three basic modes of use, using the resultDivId, the notifyTopics, or the onLoadJS. You can mix and match any combination of them to get your desired result. All of these examples are contained in the Ajax example webapp. Lets go through some scenarios to see how you might use it:
...
| Code Block |
|---|
Remote form replacing another div:
<div id='two' style="border: 1px solid yellow;">Initial content</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>
|
...
| Code Block |
|---|
<ww:form id="frm1" action="newPersonWithXMLResult" theme="ajax" >
<ww:textfield label="'Name'" name="'person.name'" value="person.name" size="20" required="true" />
<ww:submit id="submitBtn" value="Save" theme="ajax" cssClass="primary" notifyTopics="personUpdated, systemWorking" />
</ww:form>
<ww:div href="/listPeople.action" theme="ajax" errorText="error opps"
loadingText="loading..." id="cart-body" >
<ww:action namespace="" name="listPeople" executeResult="true" />
</ww:div>
|
...