首先, 配置好webwork環境.
在webwork中應用ajax技術,只要在webwork的返回值上加以區別就可以把 動態取得的值,返回給前臺瀏覽器.
在這個實例中,我們有一個html頁面,一個java文件,然後再配置文件中寫上相關映射就OK了.
代碼如下:
dynamicUpdate.html
<html><head> <title>update of ajax</title>
<script type="text/javascript">
var xmlHttp; var dom;
function createXMLHttpRequest(){
if(window.ActiveXObject){ xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); }else{ xmlHttp = new XMLHttpRequest();
} } function doStart(){ createXMLHttpRequest(); var url = "dynamicUpdate.action?task=reset"; xmlHttp.open("GET",url,true); xmlHttp.onreadystatechange = startCallback; xmlHttp.send(null); } function startCallback(){ if(xmlHttp.readyState == 4){ if(xmlHttp.status == 200 ){ setTimeout("pollServer()",5000); refreshTime(); } } } function pollServer(){ createXMLHttpRequest(); var url = "dynamicUpdate.action?task=foo"; xmlHttp.open("GET",url,true); xmlHttp.onreadystatechange = pollCallback; xmlHttp.send(null); } function refreshTime(){ var time_span = document.getElementById("time"); var time_val = time_span.innerHTML; var int_val = parseInt(time_val); var new_int_val = int_val -1; if(new_int_val > -1){ setTimeout("refreshTime()",5000); time_span.innerHTML = new_int_val; }else{ time_span.innerHTML = 5; } } function pollCallback(){ if(xmlHttp.readyState == 4){ if(xmlHttp.status == 200){ //alert(xmlHttp.responseText) // alert(xmlHttp.responseXML.childNodes.length) // alert(xmlHttp.responseXML.getElementsByTagName("message")[0]); createXMLParser(xmlHttp.responseText); var message = dom.getElementsByTagName("message")[0].firstChild.data; if(message != "done"){ var new_row = createRow(message); var table = document.getElementById("dynamicUpdateArea"); var table_body = table.getElementsByTagName("tbody").item(0); var first_row = table_body.getElementsByTagName("tr").item(1); table_body.insertBefore(new_row,first_row); setTimeout("pollServer()",5000); } } } } function createRow(message){ var row = document.createElement("tr"); var cell = document.createElement("td"); var cell_data = document.createTextNode(message); cell.appendChild(cell_data); row.appendChild(cell); return row; } //初始化XML解析器 function createXMLParser(text){ if(window.ActiveXObject){ dom = new ActiveXObject("Microsoft.XMLDOM"); dom.async = false; dom.loadXML(text); }else{ var parser = new DOMParser(); dom = parser.parseFromString(text,"text/html"); } }
</script></head><body><h1>Ajax Dynamic Update Example</h1>This page will automatically update itself:<input type="button" value="Launch" id="go" onclick="doStart()"/><p> Page will refresh in <span id="time">5</span> seconds </p><table id="dynamicUpdateArea" align="left"> <tbody> <tr id="row0"><td></td></tr> </tbody></table></body></html>DynamicUpdate.java
package control;import java.io.PrintWriter;import java.math.*;import javax.servlet.http.HttpServletResponse;import com.opensymphony.webwork.ServletActionContext;import core.BookActionSupport;public class DynamicUpdate extends BookActionSupport{ private int counter = 1; private double random; public String execute(){ String res = ""; String task = getParameter("task"); String message = ""; random = Math.floor(Math.random()*100); while(random > 7){ random = Math.sin(random)*10 ; random = Math.abs(Math.floor(random)); System.out.println(random); } counter = (int)random; if(task.equals("reset")){ counter = 1; }else{ switch(counter){ case 1: message = "Steve walks on stage"; break; case 2: message = "iPods rock"; break; case 3: message = "Steve says Macs rule"; break; case 4: message = "Change is coming"; break; case 5: message = "Yes,OS X runs on Intel-has for years"; break; case 6: message = "Macs will soon have Intel chips"; break; case 7: message = "done"; break; } } res = "<message>" + message + "</message>"; try{ HttpServletResponse response = ServletActionContext.getResponse(); PrintWriter out = response.getWriter(); response.setContentType("text/html"); response.setHeader("Cache-Control","no-cache"); out.write(res); out.close(); }catch(Exception e){ System.out.println(e.getMessage()); } return ""; }}xwork.xml
在此配文件需要注意你的包名,我的包名是helloWorld;
<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE xwork PUBLIC "-//OpenSymphony Group//XWork 1.0//EN" "X:WorkSpaceBFPPropertyconfigwebxwork-1.0.dtd"><xwork><include file="webwork-default.xml"/> <package name="helloWorld" extends="webwork-default"> <interceptors> <interceptor name="params" class="com.opensymphony.xwork.interceptor.ParametersInterceptor"/> </interceptors> <default-interceptor-ref name="defaultStack"/> <action name="dynamicUpdate" class="control.DynamicUpdate"> <result name="success">/jsp/domainS.jsp</result> <interceptor-ref name="model-driven"/> <interceptor-ref name="params"/> </action> </package></xwork>OK,如果你是copy 的代碼,在配置文件正確的情況下,應該可以運行了. 看看結果吧. 一定要注意配置文件和瀏覽器版本.在IE5以下的版本是不支持ajax的.