Struts 2 provides a set of tags to help you ajaxify your applications, most of them inherited from Webwork, and based on Dojo. Dojo 0.4 is included in Struts 2.
Remember
To use these ajax tags you need to set the "theme" attribute to "ajax".
Common Properties
These properties are common to all the ajax tags:
Attribute |
Description |
Example |
|---|---|---|
href |
url used to make the request |
/AjaxTest.action |
beforeLoading |
Javascript code which will be executed before the request is made |
alert('before!'); |
afterLoading |
Javascript code which will be executed after the request is made |
alert('after!'); |
Div
The div tag is a content area that can load its content asynchronously. The div tag can be forced to reload its content using a topic|http://dojo.jot.com/WikiHome/EventExamples]. To defined the topic that will trigger the refresh of the panel, use the refreshListenTopic" attribute.
This div will refresh every time the topic "/refresh" is published:
<s:div theme="ajax" href="/AjaxTest.action" refreshListenTopic="/refresh"/>
To publish the topic of this example use:
dojo.event.topic.publish("/refresh");
The div tag can be configured to update its content periodically, using a timer. Use the "updateInterval" attribute to set the interval used to refresh the content, this value is expressed in milliseconds. If "autoStart" is set to true, "delay" can be used to force the timer to wait for the delay period before starting. Delay is expressed in milliseconds.
This div will refresh periodically every 2 seconds, starting 3 seconds after the page is loaded:
<s:div theme="ajax" href="/AjaxTest.action" updateInterval="2000" delay="3000"/>
There is an "autoStart" attribute that controls whether the timer will be started when the page is loaded. This attribute is "true" by default. The timer can be started and stoped using topics through the attributes "startTimerListenTopic" and "stopTimerListenTopic".
This div will not start the timer by default and will listen to the start/stop topics to start its timer.
<s:div theme="ajax" href="/AjaxTest.action" startTimerListenTopic="/startTimer" stopTimerListenTopic="/stopTimer" updateInterval="3000" autoStart="false"/>
The div panel shows "Loading..." by default when the request is in process. To customize this text, use the "loadingText" attribute. If an error of any sort occurs, the error will be shown in the div area, to customize the error message, use the "errorText" attribute.
This div uses custom error/loading messages.
<s:div href="/AjaxTest.action" theme="ajax" errorText="There was an error" loadingText="reloading" updateInterval="5000"/>