JavaWEB開發中用到DWR時的配置、調用、Form提交的方法

DWR官方網站：

http://getahead.ltd.uk/dwr/

 

（一）添加DWRjar包：

從官網上下載jar包，放到lib目錄下

 

（二）編輯配置文件

    1.編輯配置文件web.xml:

         如下幾行代碼必須被添加到WEN-INF/web.xml文件中。注意，要把<servlet>和其餘<servlet>放在一塊兒，<servlet-mapping>要和其餘<servlet-mapping>放在一塊兒

 

<servlet> 
	  <servlet-name>dwr-invoker</servlet-name> 
	  <servlet-class> org.directwebremoting.servlet.DwrServlet </servlet-class> 
	  <init-param>
		  <param-name>debug</param-name> 
		  <param-value>true</param-value> 
	  </init-param> 
  </servlet> 
  <servlet-mapping> 
	  <servlet-name>dwr-invoker</servlet-name> 
	  <url-pattern>/dwr/*</url-pattern> 
  </servlet-mapping>

 

     2.在web.xml目錄下建立dwr.xml文件，內容如： 具體dwr配置詳解能夠下載：《dwr配置詳解》

 

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://www.getahead.ltd.uk/dwr/dwr20.dtd">
<dwr>
	<allow>
		<!-- 指定綁定的formBean類的路徑 -->
		<convert converter="bean" match="dwr.FormBean"/>
		<!-- javascript="service" 表示創建的js的方法名 -->
		<create creator="new" javascript="service">
			<!-- 指定類文件的路徑 -->
			<param name="class" value="dwr.Dwr" />
			<include method="getFormBean"/>
		</create>
	</allow>
</dwr>

 

其中formBean也可用Struts的生成的form，配置文件中寫好路徑、在類文件中的返回類型修改好，代碼如：

 

<allow>
		<!-- 指定綁定的formBean類的路徑 -->
		<convert converter="bean" match="thread.form.UserForm"/>
		
		<!-- 注意這裏如不定義，會在控制檯報警示錯誤，但不影響運行 -->
		<convert converter="null" match="org.apache.struts.action.ActionServletWrapper"/>
		
		<!-- javascript="service" 表示創建的js的方法名 -->
		<create creator="new" javascript="service">
			<!-- 指定類文件的路徑 -->
			<param name="class" value="dwr.Dwr" />
			<include method="getFormBean"/>
		</create>
	</allow>

 類文件修改：

 

public UserForm getFormBean(Map formMap){ 
		...
		UserForm userFomr = new UserForm(); 
		  try{ 
		   BeanUtils.populate(userFomr, formMap); 
		  ....
		  return userFomr; 
		}

 

（三）編寫類方法：

     在src的包中創建類文件，如：

 

package dwr;

import java.util.Map;

import org.apache.commons.beanutils.BeanUtils;

public class Dwr {
	public boolean checkName(String name) {
		boolean flag = false;
		if("wq".equals(name)){
			flag = true;
		}
		return flag;
	}
	
	public FormBean getFormBean(Map formMap){ 
		try {
			synchronized (this) {
				this.wait(5000);
				this.notify();
			}
		} catch (InterruptedException e1) {
			// TODO Auto-generated catch block
			e1.printStackTrace();
		}
		  FormBean formBean = new FormBean(); 
		  try{ 
		   BeanUtils.populate(formBean, formMap); 
		  }catch(Exception e){ 
		   e.printStackTrace(); 
		  } 
		  System.out.println("==============客戶端傳來的信息=============="); 
		  System.out.println("FormBean.username:"+formBean.getName()); 
		  System.out.println("FormBean.password:"+formBean.getAge()); 
		  System.out.println("========================================="); 
		  
		  System.out.println("==============客戶端傳來的信息Map=============="); 
		  System.out.println("FormBean.username:"+formMap.get("name")); 
		  System.out.println("FormBean.password:"+formBean.getAge()); 
		  System.out.println("========================================="); 
		  return formBean; 
		} 

}

 

代碼：

synchronized (this) {
    this.wait(5000);
    this.notify();
   }
使線程等待5秒，模仿網絡延遲效果

 

formBean類文件：

 

package dwr;

public class FormBean {
	private String name="";
	private int age = 0;
	public int getAge() {
		return age;
	}
	public void setAge(int age) {
		this.age = age;
	}
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	
	
}

 

（四）運行項目，檢測方法

      運行項目後訪問：http://localhost:端口/項目名/dwr，以後會出現以前定義的service的連接，點擊進入後能夠看到類中定義的方法如：

 

Methods For: service (dwr.Dwr)
To use this class in your javascript you will need the following script includes:

  <script type='text/javascript' src="/test/dwr/interface/service.js" src="test/dwr/interface/service.js"></script>
  <script type='text/javascript' src="/test/dwr/engine.js" src="test/dwr/engine.js"></script>

In addition there is an optional utility script:

  <script type='text/javascript' src="/test/dwr/util.js" src="test/dwr/util.js"></script>

Replies from DWR are shown with a yellow background if they are simple or in an alert box otherwise.
The inputs are evaluated as Javascript so strings must be quoted before execution.

getFormBean(  );  
checkName(  );  
(Warning: checkName() is excluded: Method access is denied by rules in dwr.xml. See below)

 

 （五）在頁面中加入AJAX：

    1.在頁面中引入js文件路徑：

<script type='text/javascript' src="/test/dwr/interface/service.js" src="test/dwr/interface/service.js"></script>
<script type='text/javascript' src="/test/dwr/engine.js" src="test/dwr/engine.js"></script>
<script type='text/javascript' src="/test/dwr/util.js" src="test/dwr/util.js"></script>

 

2.若是是驗證單個的數據，如用戶名：

function firstDwr() {
		service.checkName($("文本框名"), callBackHello);
	}
//回調函數
	function callBackHello(data) {
		alert(data);
	}

 

 回調函數callBackHello(data)，data自動傳入類方法的返回值進行操做

 

3.若是是提交表單操做：

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="<%=basePath%>">
		<title></title>
		<script type='text/javascript' src="/test/dwr/interface/service.js" src="test/dwr/interface/service.js"></script>
		<script type='text/javascript' src="/test/dwr/engine.js" mce_src="test/dwr/engine.js"></script>
		<script type='text/javascript' src="/test/dwr/util.js" src="test/dwr/util.js"></script>
	</head>
	<mce:script type="text/javascript"><!--
	function formsubmit() {
		dwr.util.useLoadingMessage("正在提交...");
		var formMap = dwr.util.getValues("chackForm");
		service.getFormBean(formMap, result);
	}
	function result(data) {
		alert("從服務端返回的數據：/nuserName:" + data.name + "/npassWord:" + data.age);
	}
// --></mce:script>
	<body>
		<form name="chackForm" method="post">
			<input name="name" type="text">
			<input name="age" type="text">
			<input id="sub" type="button" value="提 交" onclick="formsubmit()">
		</form>
		<br />
	</body>
</html>