Dwr入門操作手冊
DWR配置和使用
設置DWR的使用是簡單的:將DWR的jar文件拷入Web應用的WEB-INF/lib目錄中，在web.xml中增加一個servlet聲明，并創建DWR的配置文件。
DWR的分發中需要使用一個單獨的jar文件。你必須將DWR servlet加到應用的WEB-INF/web.xml中布署描述段中去。
<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>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>dwr-invoker</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
一個可選的步驟是設置DWR為調試模式—象上面的例子那樣—在servlet描述段中將debug參數設為true。當DWR在調試模式時，你可以從HTMl網頁中看到所有的可訪問的Java對象。包含了可用對象列表的網頁會出現在/WEBAPP/dwr這個url上，它顯示了對象的公共方法。所列方法可以從頁面中調用，允許你，第一次，運行服務器上的對象的方法。下圖顯示了調試頁的樣子:
調試頁
現在你必須讓DWR知道通過XMLHttpRequest對象，什么對象將會接收請求。這個任務由叫做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>
<!-- javascript的對象是TestDWR,create="new"是DWR自己創建類,通過new關鍵字創建java類的實例 -->
<create creator="new" javascript="TestDWR">
<param name="class" value="com.yd.colbean.TestDWR"></param>
<!-- include表示客戶端通過TestDWR可以調用服務器對象的那些方法
如果不寫則代表可以調用該類的所有公有(public)方法
-->
<include method="getHello"/>
</create>
</allow>
</dwr>
上面的文件實現了我們例子中的兩個目標。首先，<convert>標記告訴DWR將com.yd.pojos.Userss對象的類型轉換為聯合數組，因為，出于安全的原因，DWR默認的不會轉換普通bean。第二，<create>標記讓DWR暴露出com.yd.imp.UserCol類給JavaScript調用;我們在頁面中使用JavaScript文件被javascript屬性定義。我們必須注意<include>標記，它指明了com.yd.imp.UserCol類的哪些方法可用。
1: 基本的客戶端發送值和接受值
過程：
1：導入包dwr.jar
2: 修改web。Xml文檔
3：編寫java處理類（代碼從簡）
package com.yd.colbean;
public class TestDWR {
public String getHello(String name){
return "你好: "+name;
}
}
4：編寫Dwr.xml，在其中暴露可以腳本中間調用的方法。其中javascript="TestDWR"指在 客戶端腳本中調用的名字。<include method="getHello"/> 暴露的方法
<dwr>
<allow>
<create creator="new" javascript="TestDWR">
<param name="class" value="com.yd.colbean.TestDWR"/>
<include method="getHello"/>
</create>
</allow>
</dwr>
5：下面編寫Test1.jsp
先在jsp頁面中間增加下面的代碼。這個可以在上面提到的測試頁面中間找到，復制過來即可
<script type='text/javascript' src='/TestDWR1/dwr/interface/TestDWR.js'></script>
<script type='text/javascript' src='/TestDWR1/dwr/engine.js'></script>
<script type='text/javascript' src='/TestDWR1/dwr/util.js'></script>
<!--這里的代碼是從前面的調試頁面復制過來的。à
<!—下面的代碼自己編寫，進行業務處理-->
<SCRIPT type='text/javascript'>
function test1(){
//通過方法得到值
var s=DWRUtil.getValue("username"); //使用getvalue方法得到id為username的值
TestDWR.getHello(s,del)//調用getHello方法，第一個參數為傳遞的值，最后一個參數為回調程序
}
//回調程序，參數為返回的結果
function del(data){
//將值保存在頁面的變量中間
DWRUtil.setValue("a",data); //調用setValue方法來設置值
DWRUtil.setValue("rst",data);
}
</SCRIPT>
使用DWRUtil必須注意的事項：必須在web.xml中配置DWR Servlet在web服務器啟動時就加載實例化即 配置
<load-on-startup>1</load-on-startup>
</head>
<body>
<INPUT type="text" id="username">
<INPUT type="button" value="提交" onclick="test1()">
<INPUT type="text" id="rst">
<div id="a">
</div>
下面點擊按鈕就可以通過ajax向服務器發請求。
2: 對表格數據進行操作
剛才我們在客戶端使用文本框和div塊來輸入數據可接受數據，在這個中間可以使用下面的方法來處理數據。
DWRUtil.getValue(“username”); //這個方法得到頁面中間id為username的值
DWRUtil.setValue(“rst”,”你好”); //這個方法設置頁面中間id為username的值
在客戶端顯示數據還有其他的方式，其中使用比較多的有表格顯示數據集合，下拉框顯示多條數據。
在dwr中間可以使用方法來比較方便的再客戶端操作顯示數據
先看基本的方法
DWRUtil.removeAllOptions('rst');//刪除列表中的所有option
DWRUtil.addOptions('rst', goods,"id","msg");
//添加option對象，goods是對象數組，其屬性id作為option的value值。其屬性msg作為option的text的值
DWRUtil.removeAllRows("rst");//刪除tbody中間所有的行
DWRUtil.addRows("rst", goods,[getid, getmsg]);//添加表的行，goods數組
下面例子說明：
先看后臺bean：
Message.java封裝基本的消息
package com.yd.colbean;
public class Message {
private Integer id;
private String msg;
public Integer getId() {
return id;
}
public void setId(Integer id) {
this.id = id;
}
public String getMsg() {
return msg;
}
public void setMsg(String msg) {
this.msg = msg;
}
}
控制類
package com.yd.colbean;
import java.util.ArrayList;
import java.util.List;
public class UserCol {
private static List ls=new ArrayList();
//模擬得到所有的的消息集合,
public List getUserMessage(){
if(ls.size()<2){//如果消息數量太少，就刪除，另外增加，在實際中應該從數據庫中取值
ls.clear();
for(int i=0;i<6;i++){
Message msg=new Message();
msg.setId(new Integer(i));
msg.setMsg("消息內容"+i);
ls.add(msg);
}
}
return ls;
}
}
配置文件
Web.xml同上
dwr.xml
<dwr>
<allow>
<!-- convert將Message的集合變成javascript中間的對象數組-->
<convert converter="bean" match="com.yd.colbean.Message"/>
<create creator="new" javascript="userAction" scope="session">
<param name="class" value="com.yd.colbean.UserCol"></param>
<include method="getUserMessage" />
</create>
</allow>
</dwr>
注意在服務器返回集合到客戶端時，需要進行轉換位javascript的對象。需要定義convert
下面是
Test1.jsp
同樣需要復制
<script type='text/javascript' src='/TestDWR2/dwr/interface/userAction.js'/>
<script type='text/javascript' src='/TestDWR2/dwr/engine.js'></script>
<script type='text/javascript' src='/TestDWR2/dwr/util.js'></script>
到頁面中間
<SCRIPT type='text/javascript'>
//這個函數在點擊按鈕的時候調用。首先刪除rst這個tbody中間的內容。然后請求服務器的方法
function test1() {
DWRUtil.removeAllRows("rst");
userAction.getUserMessage(fillTable);
}
//這里定義對數據的轉化規則，轉換規則是用對象數據中的每一個對象來進行轉換，返回一個字符串或其他對象，顯示在表格的td中間
var getid = function(unit) {
if (unit.id % 2 == 0)
return "<font color=red>"+unit.id+"</font>";
else
return "<font color=green>"+unit.id+"</font>";
};
var getmsg = function(unit) { return unit.msg};
var bt=function(unit) {
return "<input type='button' value='delete' onclick='alert(\""+unit.id+"\");'/>";
};
//回調函數 ，在這里會對返回的goods對象集合，循環調用對應的轉化規則來得到沒一行的內容來顯示
function fillTable(goods) {
//對于dwr2，我們需要增加下面這個語句
//這個方法用來設置dwr是不是轉化對應的html標簽
DWRUtil.setEscapeHtml(false);
DWRUtil.addRows("rst", goods,[getid, getmsg,bt]);
}
</SCRIPT>
</head>
<body>
<INPUT type="button" value="得到消息" onclick="test1()">
<table>
<thead> <!—這個是表格的頭 -->
<th>id</th>
<th>msg</th>
<th>aa</th>
</thead>
<tbody id="rst"> <!—這個是表格的主體，使用ajax來動態的修改 -->
</tbody>
</table>
</body>
最后顯示結果
點擊按鈕
