五、AJAX标签
<%@taglib prefix="sx" uri="/struts-dojo-tags" %>
记得在<head></head>中加上<sx:head/>标签，<sx:head/>标签 用来下载Dojo文件和相应的Javascript代码
1）<sx:div>标签
<sx:div>标签可以异步定时加载刷新数据。
|
<!-- 用于显示异步加载的数据 --> <div id="msg"> <s:property value="message"/> </div> <!-- 定时5s加载test2.action中的message属性值，并刷新id=“msg”的div标签--> <sx:div updateFreq="5000" href="test2/test2.action" delay="100" errorText="出错了!" loadingText="正在请求..." showLoadingText="true" indicator="msg"> </sx:div> |
href：异步请求的资源地址。
updateFreq：自动更新div内容的间隔，以毫秒为单位。
autoStart：页面加载后是否启动定时器，默认为true。
delay：第一个异步请求开始之前等待的时间，以毫秒为单位。
loadText：当请求正在处理时显示的文本。
showLoadingText：是否显示loadText值，默认为false。
errorText：当请求失败时显示的文本。
indicator：当请求正在处理时具有这个id的元素将被显示。
executeScript：执行服务器返回内容中的javascript代码，默认为false。
formId：指定表单id，表单字段将被序列化并作为参数传递。
2）<sx:a>标签
|
<!-- 单击"用户信息列表信息" 链接后会加载userList.jsp表到userListDiv标签上，其中getUserList.action是跳转到userList.jsp页面的 --> <sx:a href="test2/getUserList.action" targets="userListDiv" loadingText="加载中..." showLoadingText="true" errorText="加载失败!">用户信息列表</sx:a> <div id="userListDiv"></div> <!-- userList.jsp --> <body> <table border="1" cellpadding="0" cellspacing="0"> <thead> <tr> <th colspan="4">用户信息列表</th> </tr> </thead> <tbody> <tr> <th>序列号</th> <th>用户名</th> </tr> <s:iterator value="users" id="us" status="u"> <tr> <td><s:property value="#u.index"/></td> <td><s:property value="name"/></td> </tr> </s:iterator> </tbody> </table> </body>
|
href：异步请求的资源地址。
targets：被更新的元素列表。
loadText：当请求正在处理时显示的文本。
showLoadingText：是否显示loadText值，默认为false。
errorText：当请求失败时显示的文本。
indicator：当请求正在处理时具有这个id的元素将被显示。
executeScript：执行服务器返回内容中的javascript代码，默认为false。
formId：指定表单id，表单字段将被序列化并作为参数传递。
3）<sx:submit>标签
<sx:submit>标签的使用和<sx:a>标签的使用一样，这里就不举例了。
4）<sx:datetimepicker>标签
|
<sx:datetimepicker name="book.publicationDate" value="today" label="出版日期" displayFormat="yyyy-MM-dd" ></sx:datetimepicker> |
5）<sx:textarea>标签
|
<sx:textarea name="user.remark" label="备注" rows="20" cols="50"></sx:textarea> |
提示：<sx:textarea>标签提交的文本是带Html标签的。
6）<sx:tree>标签
|
<sx:tree label="城市" id="city" showRootGrid="false" showGrid="false" treeSelectedTopic="treeSelected"> <sx:treenode label="北京" id="bj"> <sx:treenode label="朝阳" id="cy"></sx:treenode> <sx:treenode label="中关村" id="zgc"></sx:treenode> </sx:treenode> <sx:treenode label="天津" id="tj"> <sx:treenode label="白洋淀" id="byd"></sx:treenode> </sx:treenode> </sx:tree> <script language="JavaScript" type="text/javascript"> dojo.event.topic.subscribe("treeSelected", function treeNodeSelected(node) { alert(node.node.widgetId + node.node.title); }); </script>
|
showRootGrid：是否显示根节点，默认为true。
showGrid：是否显示结点间的连接线，默认为true。
treeSelectedTopic：选中时的时间。
7）<sx:tabbedpanel>标签
|
<sx:tabbedpanel id="tab1" cssStyle="width:300px;" labelposition="top" selectedTab="tab2"> <sx:div id="tab1" label="Tab 1" cssStyle="height:100px;" href="index.jsp" closable="true" preload="false" > Local Tab 1 </sx:div> <sx:div id="tab2" label="Tab 2" cssStyle="height:100px;" href ="index.jsp" refreshOnShow="true"> Local Tab 2 </sx:div> <sx:div id="tab3" label="Tab 3" disabled="true"> Local Tab 3 </sx:div> </sx:tabbedpanel> |
closable：设置该tab标签是否可关闭。
href：加载资源。若为jsp页面，则加载该页面到该tab中。
preload：设置是否预先加载，默认为true。
cssStyle：用于设置tab选项卡大小。
refreshOnShow：设置是否每次单击选项卡重新加载内容，默认为false。
disabled：设置选项卡是否失效，默认为false。
labelposition：设置选项卡标头的显示位置，可以是top, right, bottom, left。
selectedTab：设置默认选中的选项卡。