DWR入门使用及配置，并获得返回为List类型的数据

http://www.iteye.com/topic/652199

第一次来JAVA Eye发文章，以前主要在百度、CSDN发，最近经常来这里看文章就顺便注册了一个。这两天一直在公司搞DWR AJAX框架，也是刚学，了解的不是太深。今天星期6闲来无事，就来写写。唉，说了一大堆废话，好了下面进入正题。

DWR框架功能确实挺强大的，感觉使用起来也挺方便的，主要是配置容易出问题，大多数JAVA里面的框架都配置一大堆，这方面感觉太繁琐。现在写下DWR的简单使用以及如何在JSP页面接收返回List类型的数据。要想使用DWR框架得有以下几个步骤：

 

一准备

1、下载JAR包

我使用的DWR2.0，所以下载相应的JAR包就行了，一般放到WEB-INF的Lib包下就行了。（当初做的时候，启动TOMCAT时候，出现了错误，说的是缺少日志JAR包，后来就加了commons-logging-1.1.1.jar就没事了，网上看别人用的时候没出现此问题。）

2、接下来就是配置了

首先是配置 web.xml.在web.xml加上

 

 

 

<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>

 <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>

 

这样配置就行了，具体意思，我想你看下就应该明白了。

3 建个dwr.xml配置文件，和web.xml放在一个文件夹下就行了。我用MyEclipse8做的，可以直接新建个XML文件。

这里面主要配置一些有关后台JAVA类的，配置好后，DWR框架就会帮助你生成一些JS文件。详细说明下边再说。

二编码

1、 基本的准备好后就可以开始写JAVA代码了。

class:Book

 

package com.liang;

public class Book {
    private String id;
    private String name;
    private String pass;
    public String getId() {
        return id;
    }
    public void setId(String id) {
        this.id = id;
    }
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
    public String getPass() {
        return pass;
    }
    public void setPass(String pass) {
        this.pass = pass;
    }
}

package com.liang;

public class Book {
	private String id;
	private String name;
	private String pass;
	public String getId() {
		return id;
	}
	public void setId(String id) {
		this.id = id;
	}
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public String getPass() {
		return pass;
	}
	public void setPass(String pass) {
		this.pass = pass;
	}
}

class: BookList

 

 

package com.liang;
import java.util.ArrayList;
import java.util.List;
import java.util.ResourceBundle;
public class BookList {

    public List <SPAN style="COLOR: #ff0000">getList</SPAN>( ){
        List list=new ArrayList();
        Book book=null;
        for(int i=1;i<3;i++){
            book=new Book();
            book.setId("id"+i);
            book.setName("name"+i);
            book.setPass("pass"+i);
            list.add(book);
        }
        System.out.print(list);
        return list;
    }
    }

package com.liang;
import java.util.ArrayList;
import java.util.List;
import java.util.ResourceBundle;
public class BookList {
	
	public List getList( ){
		List list=new ArrayList();
		Book book=null;
		for(int i=1;i<3;i++){
			book=new Book();
			book.setId("id"+i);
			book.setName("name"+i);
			book.setPass("pass"+i);
			list.add(book);
		}
		System.out.print(list);
		return list;
	}
	}

 

这是我当初写的测试代码，一个Book类，一个BookList.我写的这个测试主要用来返回一个List然后用DWR框架在JSP页面循环得到这些数据。BookList里面有个返回List类型的的getList()方法，用来返回后台数据，

实际做开发的时候数据一般都从数据库查出来，自己做下相应的更改就行了。

这两个JAVA类写完后，后台代码基本就OK了，现在最重要的是进行配置了，如何让DWR能够找到这些JAVA类，并执行相应的工作呢。先看看我的dwr.xml配置：

<?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>
<!--
下面这部分配置好后,启动tomcat后会生成一个JS文件，在这里可以自定义JS文件名，
我这样写的： javascript="BookList" 习惯用类名来定义，页面调用JS时候就用这个名字.
value="com.liang.BookList" 这个用来定义你的类所在位置（有包了加包名，不然找不到）。
-->
<create javascript="BookList" creator="new" scope="application">
<param  name="class" value="com.liang.BookList"></param>
</create>
<!--
match="com.liang.Book" 这个用来定义实体类的位置（有包了加包名，第一次做的时候忘记加了，
害了我半天时间得不到值），因为我返回List方法中，
里面封转的是Book类型，Book又有自己的属性ID，name等，
JSP页面获得时候就得根据他里面的属性得到值。
value="id,name,pass"这里面主要定义你在JSP页面获得那个属性值时要用到的，
 -->
<convert match="com.liang.Book" converter="bean">
<param name="include" value="id,name,pass"/>
</convert>

<!--
下面这个配置主要为了显示异常信息，如果不配置的话，程序中所有的错误，
都只弹出error的对话框，这样我们就看不到详细的错误信息，加大了调试难度，
相对配置的话，就会把Error转换成具体的错误描述来看，就如同你在日志看到异常信息一样。
 -->
<convert converter="bean" match="java.lang.StackTraceElement" />
<convert converter="exception" match="java.lang.Exception"/>

</allow>
</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>
<!-- 
下面这部分配置好后,启动tomcat后会生成一个JS文件，在这里可以自定义JS文件名，
我这样写的： javascript="BookList" 习惯用类名来定义，页面调用JS时候就用这个名字.
value="com.liang.BookList" 这个用来定义你的类所在位置（有包了加包名，不然找不到）。
-->
<create javascript="BookList" creator="new" scope="application">
<param  name="class" value="com.liang.BookList"></param>
</create>
<!-- 
match="com.liang.Book" 这个用来定义实体类的位置（有包了加包名，第一次做的时候忘记加了，
害了我半天时间得不到值），因为我返回List方法中，
里面封转的是Book类型，Book又有自己的属性ID，name等，
JSP页面获得时候就得根据他里面的属性得到值。
value="id,name,pass"这里面主要定义你在JSP页面获得那个属性值时要用到的，
 -->
<convert match="com.liang.Book" converter="bean">
<param name="include" value="id,name,pass"/>
</convert>

<!-- 
下面这个配置主要为了显示异常信息，如果不配置的话，程序中所有的错误，
都只弹出error的对话框，这样我们就看不到详细的错误信息，加大了调试难度，
相对配置的话，就会把Error转换成具体的错误描述来看，就如同你在日志看到异常信息一样。
 -->
<convert converter="bean" match="java.lang.StackTraceElement" />
<convert converter="exception" match="java.lang.Exception"/>

</allow>
</dwr>

三JSP页面显示

首先在页面引入

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

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

BookList.js就是在dwr.xml文件配置的，两个名字要对应，路径在：dwr/interface/ 这个目录下都统一的。

下面两个都是DWR自动生成的，里面有一些实现AJAX的函数和一些工具类

然后是我的bookJSP页面

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<html>
  <head>
    <title>My JSP 'index.jsp' starting page</title>
     <script type='text/javascript' src='dwr/interface/BookList.js'></script>
     <script type='text/javascript' src='dwr/engine.js'></script>
      <script type='text/javascript' src='dwr/util.js'></script>
    <script type="text/javascript">
    window.onload=function (){//页面加载时候调用
     BookList.getList(callBackMethod);//BookList是BookList.js这个名字,
     //getList当然是你自己写的方法名,参数是回调下面的函数，
    //这个参数是必须有的， 如果方法里面需要传参数的话，可以在里面加参数
    //比如我根据name查询然后返回List可以写成这种， BookList.getList(name,callBackMethod);
     }
 function callBackMethod(dataList){//dataList可以自定义，是返回的数组名
     alert(dataList.length);//显示返回数组值的长度
    for(var d in dataList){//循环弹出相关的值，当时我做测试时候写的。
       alert("name:"+dataList[d].name);
      alert("pass:"+dataList[d].pass);
     }
 DWRUtil.removeAllRows("table4");//删除table4里面的所有行。DWR里面util.js中的方法。
 DWRUtil.addRows("table4",
 //循环显示数据并自动增加tr,也是DWR里面util.js中的方法。详细使用说明可以去网上找找
 dataList,[function(item){return item.id},
 function(item){
 return "<a target='_blank'  href='index.jsp?id="+item.id+"'>"+item.name+"</a>";//显示一个超连接
 },function(item){return item.pass}],{escapeHtml:false} );
     }

    </script>
  </head>
  <body>
     <table  border="1"><tr><td>id</td><td>name</td><td>pass</td></tr>
     <tbody id="table4"></tbody>
     </table>
  </body>
</html>

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> 
<html>
  <head>
    <title>My JSP 'index.jsp' starting page</title>
     <script type='text/javascript' src='dwr/interface/BookList.js'></script>  
     <script type='text/javascript' src='dwr/engine.js'></script> 
      <script type='text/javascript' src='dwr/util.js'></script>  
	<script type="text/javascript">
	window.onload=function (){//页面加载时候调用
	 BookList.getList(callBackMethod);//BookList是BookList.js这个名字,
	 //getList当然是你自己写的方法名,参数是回调下面的函数，
	//这个参数是必须有的， 如果方法里面需要传参数的话，可以在里面加参数
	//比如我根据name查询然后返回List可以写成这种， BookList.getList(name,callBackMethod);
	 }
 function callBackMethod(dataList){//dataList可以自定义，是返回的数组名
	 alert(dataList.length);//显示返回数组值的长度
	for(var d in dataList){//循环弹出相关的值，当时我做测试时候写的。
	   alert("name:"+dataList[d].name);
	  alert("pass:"+dataList[d].pass);
	 }
 DWRUtil.removeAllRows("table4");//删除table4里面的所有行。DWR里面util.js中的方法。
 DWRUtil.addRows("table4", 
 //循环显示数据并自动增加tr,也是DWR里面util.js中的方法。详细使用说明可以去网上找找
 dataList,[function(item){return item.id},
 function(item){  
 return "<a target='_blank'  href='index.jsp?id="+item.id+"'>"+item.name+"</a>";//显示一个超连接
 },function(item){return item.pass}],{escapeHtml:false} );
	 }
	 
	</script>
  </head>
  <body>
     <table  border="1"><tr><td>id</td><td>name</td><td>pass</td></tr>
     <tbody id="table4"></tbody>
     </table>
  </body>
</html>

源文件已经打包好了。

四总结

开发过程也出现了不少问题，

刚开始容易出现，对象不支持此属性或方法，**没有定义 之类的可能是在引入对应的JS文件路径错误，

或者页面方法调用时候 名字写错。其它的就不写了。

写这个主要是做学习记录，刚学DWR，理解不是太深，当中好多可能用词不当，不够详细明白，有错希望大家指正，一起学习进步。