DWR 初步,返回字符串&对象&列表与SPRING集成处理,带实例(CTO)
DWR 初始,返回字符串&对象&列表与SPRING集成处理,带实例(CTO)
DWR(全称:Direct Web Remoting)是一个JavaEE模型的一个AJAX框架,通过配置和指定回调JavaScript函数并可直接调用服务端后台业务方法,
并得到是一个WEB远程调用框架.利用DWR框架可以让AJAX开发变得更加简单.DWR可以在客户端利用JavaScript直接调用服务端的 Java方法并返
回值给JavaScript就好像直接本地客户端调用一样(DWR根据Java类来动态生成JavaScrip代码).它的最新版本DWR3.0添加许多特性如:支持Dom
Trees的自动配置,支持Spring(通过配置可直接远程调用,从Spring Bean中获取业务对象),更好浏览器支持,还支持一个可选的commons-
logging日记操作.
该项目主页:http://www.getahead.ltd.uk/dwr/
目前该项目的正式版3.0以发布,可以到些去选择需要的版本进行下载:
http://directwebremoting.org/dwr/download.html
有了包那么下面我们来实现一个简单的例子来说明在实际应用中的方法,首先我按四大步来划分
1、调用服务端后台业务对象返回字符串
2、调用服务端后台业务对象并返回一个 Bean 对象
3、调用服务端后台业务对象返回列表
4、与SPRING进行集成,并同时实现以上3项同样业务
实现部分:
新建一个WEB工程,将下载的dwr.jar拷到项目的lib目录中,能后在WEB-INF目录下新建一个dwr.xml 文件,在web.xml 中添加一个DWR的请求控制
,接下来我会对dwr.xml中进行配置生成业务对象方式,我将不会加以注释详细说明,详细说明我将放在文章的最后面
Xml代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3Cservlet%3E%0A%09%3Cservlet-name%3Edwr%3C%2Fservlet-name%3E%0A%09%3Cservlet-class%3E%0A%09%09org.directwebremoting.servlet.DwrServlet%0A%09%3C%2Fservlet-class%3E%0A%09%3Cinit-param%3E%0A%09%09%3Cparam-name%3EDebug%3C%2Fparam-name%3E%0A%09%09%3Cparam-value%3Etrue%3C%2Fparam-value%3E%0A%09%3C%2Finit-param%3E%0A%3C%2Fservlet%3E%0A%3Cservlet-mapping%3E%0A%09%3Cservlet-name%3Edwr%3C%2Fservlet-name%3E%0A%09%3Curl-pattern%3E%2Fdwr%2F*%3C%2Furl-pattern%3E%0A%3C%2Fservlet-mapping%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. < servlet >
2. < servlet-name > dwr </ servlet-name >
3. < servlet-class >
4. org.directwebremoting.servlet.DwrServlet
5. </ servlet-class >
6. < init-param >
7. < param-name > Debug </ param-name >
8. < param-value > true </ param-value >
9. </ init-param >
10. </ servlet >
11. < servlet-mapping >
12. < servlet-name > dwr </ servlet-name >
13. < url-pattern > /dwr/* </ url-pattern >
14. </ servlet-mapping >
<servlet>
<servlet-name>dwr</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</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
再添加一个Users.java
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=package%20com.dwrtest.service%3B%0A%0A%2F**%0A%20*%20%3Cp%3E%0A%20*%20%E5%88%9B%20%E5%BB%BA%20%E4%BA%BA%EF%BC%9AChenTao%0A%20*%20%3Cp%3E%0A%20*%20%E5%88%9B%E5%BB%BA%E6%97%A5%E6%9C%9F%EF%BC%9A2009-5-26%20%E4%B8%8A%E5%8D%889%3A04%3A44%0A%20*%20%3Cp%3E%0A%20*%2F%0Apublic%20class%20Users%20%7B%0A%09%0A%09private%20Integer%20userId%3B%0A%09%0A%09private%20String%20userName%3B%0A%09%0A%09private%20String%20password%3B%0A%09%0A%09%2F%2Fget...%20set...%20%E6%96%B9%E6%B3%95%E7%95%A5%0A%7D" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. package com.dwrtest.service;
2.
3. /**
4. * <p>
5. * 创 建 人:ChenTao
6. * <p>
7. * 创建日期:2009-5-26 上午9:04:44
8. * <p>
9. */
10. public class Users {
11.
12. private Integer userId;
13.
14. private String userName;
15.
16. private String password;
17.
18. //get... set... 方法略
19. }
package com.dwrtest.service;
/**
* <p>
* 创 建 人:ChenTao
* <p>
* 创建日期:2009-5-26 上午9:04:44
* <p>
*/
public class Users {
private Integer userId;
private String userName;
private String password;
//get... set... 方法略
}
上面二个文件在全局中都会使用到,下面声明将不对这二个文件描述
好了我们先来实现第一步:
一、返回字符串
先新建一个Dao.java
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=package%20com.dwrtest.dao.impl%3B%0A%0Aimport%20java.util.ArrayList%3B%0Aimport%20java.util.List%3B%0A%0Aimport%20com.dwrtest.dao.IDao%3B%0Aimport%20com.dwrtest.service.Users%3B%0A%0Apublic%20class%20Dao%20implements%20IDao%7B%0A%09%0A%09public%20String%20login1(String%20userName%2C%20String%20password)%20%7B%0A%09%09if(%22ctojxzsycztao%22.equals(userName)%20%26%26%20%22ctojxzsycztao%22.equals(password))%7B%0A%09%09%09return%20%22%E7%99%BB%E5%BD%95%E6%88%90%E5%8A%9F!%22%3B%0A%09%09%7D%0A%09%09return%20%22%E7%99%BB%E5%BD%95%E5%A4%B1%E8%B4%A5!%22%3B%0A%09%7D%0A%7D" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. package com.dwrtest.dao.impl;
2.
3. import java.util.ArrayList;
4. import java.util.List;
5.
6. import com.dwrtest.dao.IDao;
7. import com.dwrtest.service.Users;
8.
9. public class Dao implements IDao{
10.
11. public String login1(String userName, String password) {
12. if ( "ctojxzsycztao" .equals(userName) && "ctojxzsycztao" .equals(password)){
13. return "登录成功!" ;
14. }
15. return "登录失败!" ;
16. }
17. }
package com.dwrtest.dao.impl;
import java.util.ArrayList;
import java.util.List;
import com.dwrtest.dao.IDao;
import com.dwrtest.service.Users;
public class Dao implements IDao{
public String login1(String userName, String password) {
if("ctojxzsycztao".equals(userName) && "ctojxzsycztao".equals(password)){
return "登录成功!";
}
return "登录失败!";
}
}
新建一个DwrService.java,代码如下:
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=package%20com.dwrtest.service%3B%0A%0Aimport%20com.dwrtest.dao.IDao%3B%0Aimport%20com.dwrtest.dao.impl.Dao%3B%0A%0A%2F**%0A%20*%20%3Cp%3E%0A%20*%20%E5%88%9B%20%E5%BB%BA%20%E4%BA%BA%EF%BC%9AChenTao%0A%20*%20%3Cp%3E%0A%20*%20%E5%88%9B%E5%BB%BA%E6%97%A5%E6%9C%9F%EF%BC%9A2009-5-26%20%E4%B8%8A%E5%8D%8809%3A38%3A51%0A%20*%20%3Cp%3E%0A%20*%2F%0Apublic%20class%20DwrService%20%7B%0A%0A%09private%20IDao%20dao%20%3D%20new%20Dao()%3B%0A%0A%09public%20IDao%20getDao()%20%7B%0A%09%09return%20dao%3B%0A%09%7D%0A%0A%09public%20void%20setDao(IDao%20dao)%20%7B%0A%09%09this.dao%20%3D%20dao%3B%0A%09%7D%0A%09public%20String%20login1(String%20userName%2CString%20password)%7B%0A%09%09return%20dao.login1(userName%2C%20password)%3B%0A%09%7D%0A%7D" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. package com.dwrtest.service;
2.
3. import com.dwrtest.dao.IDao;
4. import com.dwrtest.dao.impl.Dao;
5.
6. /**
7. * <p>
8. * 创 建 人:ChenTao
9. * <p>
10. * 创建日期:2009-5-26 上午09:38:51
11. * <p>
12. */
13. public class DwrService {
14.
15. private IDao dao = new Dao();
16.
17. public IDao getDao() {
18. return dao;
19. }
20.
21. public void setDao(IDao dao) {
22. this .dao = dao;
23. }
24. public String login1(String userName,String password){
25. return dao.login1(userName, password);
26. }
27. }
package com.dwrtest.service;
import com.dwrtest.dao.IDao;
import com.dwrtest.dao.impl.Dao;
/**
* <p>
* 创 建 人:ChenTao
* <p>
* 创建日期:2009-5-26 上午09:38:51
* <p>
*/
public class DwrService {
private IDao dao = new Dao();
public IDao getDao() {
return dao;
}
public void setDao(IDao dao) {
this.dao = dao;
}
public String login1(String userName,String password){
return dao.login1(userName, password);
}
}
修改dwr.xml 文件内容如下:
Xml代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3C!DOCTYPE%20dwr%20PUBLIC%20%22-%2F%2FGetAhead%20Limited%2F%2FDTD%20Direct%20Web%20Remoting%202.0%2F%2FEN%22%20%22http%3A%2F%2Fgetahead.org%2Fdwr%2Fdwr20.dtd%22%3E%0A%3Cdwr%3E%0A%09%3Callow%3E%0A%09%09%3Ccreate%20creator%3D%22new%22%20javascript%3D%22dwrService%22%3E%0A%09%09%09%3Cparam%20name%3D%22class%22%20value%3D%22com.dwrtest.service.DwrService%22%2F%3E%0A%09%09%3C%2Fcreate%3E%0A%09%3C%2Fallow%3E%0A%3C%2Fdwr%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. <? xml version = "1.0" encoding = "UTF-8" ?>
2. <!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr/dwr20.dtd">
3. < dwr >
4. < allow >
5. < create creator = "new" javascript = "dwrService" >
6. < param name = "class" value = "com.dwrtest.service.DwrService" />
7. </ create >
8. </ allow >
9. </ dwr >
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr/dwr20.dtd">
<dwr>
<allow>
<create creator="new" javascript="dwrService">
<param name="class" value="com.dwrtest.service.DwrService"/>
</create>
</allow>
</dwr>
最后创建一个dwrStr.jsp
Html代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3C%25%40%20page%20language%3D%22java%22%20contentType%3D%22text%2Fhtml%3Bcharset%3DUTF-8%22%25%3E%0A%3C!DOCTYPE%20HTML%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20HTML%204.01%20Transitional%2F%2FEN%22%3E%0A%3Chtml%3E%0A%20%20%3Chead%3E%0A%20%20%20%20%3Ctitle%3EDwr%20Test%3C%2Ftitle%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Futil.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Fengine.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Finterface%2FdwrService.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%3E%0A%09%09%3C!--%5C%5C%0A%09%09function%20login()%7B%0A%09%09%20%20%20%20%20dwrService.login1(document.getElementById(%22userName%22).value%2Cdocument.getElementById%0A%0A(%22passWord%22).value%2CcellBackStr)%3B%0A%09%09%7D%0A%0A%09%09%2F%2F%20%E5%A4%84%E7%90%86%E8%BF%94%E5%9B%9E%E7%9A%84%E5%AD%97%E7%AC%A6%E4%B8%B2%0A%09%09function%20cellBackStr(str)%7B%0A%09%09%09DWRUtil.setValue(%22div%22%2Cstr)%3B%0A%09%09%7D%0A%09%09--%3E%0A%09%3C%2Fscript%3E%0A%09%3Cstyle%20type%3D%22text%2Fcss%22%3E%0A%09%3C!--%0A%09%09.FONT%7Bfont-size%20%3A%2012px%3B%7D%0A%09--%3E%0A%09%3C%2Fstyle%3E%0A%20%20%3C%2Fhead%3E%0A%20%20%3Cbody%3E%0A%20%20%3Cdiv%20id%3D%22div%22%20class%3D%22FONT%22%3E%3C%2Fdiv%3E%0A%20%20%20%20%20%3Ctable%20border%3D0%20class%3D%22FONT%22%3E%0A%20%20%20%20%20%09%3Ctr%3E%0A%20%20%20%20%20%09%09%3Ctd%20class%3D%22FONT%22%3EuserName%3A%3C%2Ftd%3E%0A%09%09%3Ctd%20class%3D%22FONT%22%3E%3Cinput%20type%3D%22text%22%20id%3D%22userName%22%20name%3D%22userName%22%3E%3C%2Ftd%3E%0A%20%20%20%20%20%09%3C%2Ftr%3E%0A%20%20%20%20%20%09%3Ctr%3E%0A%20%20%20%20%20%09%09%3Ctd%20class%3D%22FONT%22%3EpassWord%3A%3C%2Ftd%3E%0A%09%09%3Ctd%20class%3D%22FONT%22%3E%3Cinput%20type%3D%22text%22%20id%3D%22passWord%22%20name%3D%22passWord%22%3E%3C%2Ftd%3E%0A%20%20%20%20%20%09%3C%2Ftr%3E%0A%20%20%20%20%20%09%3Ctr%3E%0A%20%20%20%20%20%09%09%3Ctd%20colspan%3D2%3E%0A%20%20%20%20%20%09%09%09%3Cinput%20type%3D%22button%22%20value%3D%22login%22%20onclick%3D%22login()%3B%22%3E%0A%20%20%20%20%20%09%09%3C%2Ftd%3E%0A%20%20%20%20%20%09%3C%2Ftr%3E%0A%20%20%20%20%20%3C%2Ftable%3E%0A%20%20%3C%2Fbody%3E%0A%3C%2Fhtml%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. < %@ page language = "java" contentType = "text/html;charset=UTF-8" % >
2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
3. < html >
4. < head >
5. < title > Dwr Test </ title >
6. < script type = "text/javascript" src = "dwr/util.js" > </ script >
7. < script type = "text/javascript" src = "dwr/engine.js" > </ script >
8. < script type = "text/javascript" src = "dwr/interface/dwrService.js" > </ script >
9. < script type = "text/javascript" >
10. <!--\\
11. function login(){
12. dwrService.login1(document.getElementById("userName").value,document.getElementById
13.
14. ("passWord").value,cellBackStr);
15. }
16.
17. // 处理返回的字符串
18. function cellBackStr(str){
19. DWRUtil.setValue("div",str);
20. }
21. -->
22. </ script >
23. < style type = "text/css" >
24. <!--
25. .FONT{font-size : 12px;}
26. -->
27. </ style >
28. </ head >
29. < body >
30. < div id = "div" class = "FONT" > </ div >
31. < table border = 0 class = "FONT" >
32. < tr >
33. < td class = "FONT" > userName: </ td >
34. < td class = "FONT" > < input type = "text" id = "userName" name = "userName" > </ td >
35. </ tr >
36. < tr >
37. < td class = "FONT" > passWord: </ td >
38. < td class = "FONT" > < input type = "text" id = "passWord" name = "passWord" > </ td >
39. </ tr >
40. < tr >
41. < td colspan = 2 >
42. < input type = "button" value = "login" onclick = "login();" >
43. </ td >
44. </ tr >
45. </ table >
46. </ body >
47. </ html >
<%@ page language="java" contentType="text/html;charset=UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Dwr Test</title>
<script type="text/javascript" src="dwr/util.js"></script>
<script type="text/javascript" src="dwr/engine.js"></script>
<script type="text/javascript" src="dwr/interface/dwrService.js"></script>
<script type="text/javascript">
<!--\\
function login(){
dwrService.login1(document.getElementById("userName").value,document.getElementById
("passWord").value,cellBackStr);
}
// 处理返回的字符串
function cellBackStr(str){
DWRUtil.setValue("div",str);
}
-->
</script>
<style type="text/css">
<!--
.FONT{font-size : 12px;}
-->
</style>
</head>
<body>
<div id="div" class="FONT"></div>
<table border=0 class="FONT">
<tr>
<td class="FONT">userName:</td>
<td class="FONT"><input type="text" id="userName" name="userName"></td>
</tr>
<tr>
<td class="FONT">passWord:</td>
<td class="FONT"><input type="text" id="passWord" name="passWord"></td>
</tr>
<tr>
<td colspan=2>
<input type="button" value="login" onclick="login();">
</td>
</tr>
</table>
</body>
</html>
大家看到上面的实现和配置都非常简单,易懂、易学,现在我们来看下第二步
二、返回Bean对象
首先在 Dao.java 与 DwrService.java文件中添加一个方法 login2
Dao.java 中的 login2 方法
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=public%20Users%20login2(String%20userName%2C%20String%20password)%20%7B%0A%09if%20(%22ctojxzsycztao%22.equals(userName)%20%26%26%20%22ctojxzsycztao%22.equals(password))%20%7B%0A%09%09Users%20users%20%3D%20new%20Users()%3B%0A%09%09users.setUserId(1)%3B%0A%09%09users.setUserName(%22chentao%22)%3B%0A%09%09users.setPassword(%22chentao%22)%3B%0A%09%09return%20users%3B%0A%09%7D%0A%09return%20null%3B%0A%7D" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. public Users login2(String userName, String password) {
2. if ( "ctojxzsycztao" .equals(userName) && "ctojxzsycztao" .equals(password)) {
3. Users users = new Users();
4. users.setUserId(1 );
5. users.setUserName("chentao" );
6. users.setPassword("chentao" );
7. return users;
8. }
9. return null ;
10. }
public Users login2(String userName, String password) {
if ("ctojxzsycztao".equals(userName) && "ctojxzsycztao".equals(password)) {
Users users = new Users();
users.setUserId(1);
users.setUserName("chentao");
users.setPassword("chentao");
return users;
}
return null;
}
DwrService.java 中的login2方法
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=public%20Users%20login2(String%20userName%2C%20String%20password)%20%7B%0A%09return%20dao.login2(userName%2C%20password)%3B%0A%7D" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. public Users login2(String userName, String password) {
2. return dao.login2(userName, password);
3. }
public Users login2(String userName, String password) {
return dao.login2(userName, password);
}
同样需要修改 dwr.xml 文件,修改后的内容如下:
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3Cdwr%3E%0A%09%3Callow%3E%0A%09%09%3Ccreate%20javascript%3D%22dwrService%22%20creator%3D%22new%22%3E%0A%09%09%09%3Cparam%20name%3D%22class%22%20value%3D%22dwrService%22%20%2F%3E%0A%09%09%3C%2Fcreate%3E%0A%09%09%3Cconvert%20converter%3D%22bean%22%20match%3D%22com.dwrtest.service.Users%22%3E%0A%09%09%09%3Cparam%20name%3D%22include%22%20value%3D%22userId%2CuserName%2Cpassword%22%2F%3E%0A%09%09%3C%2Fconvert%3E%0A%09%3C%2Fallow%3E%0A%3C%2Fdwr%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. <dwr>
2. <allow>
3. <create javascript="dwrService" creator= "new" >
4. <param name="class" value= "dwrService" />
5. </create>
6. <convert converter="bean" match= "com.dwrtest.service.Users" >
7. <param name="include" value= "userId,userName,password" />
8. </convert>
9. </allow>
10. </dwr>
<dwr>
<allow>
<create javascript="dwrService" creator="new">
<param name="class" value="dwrService" />
</create>
<convert converter="bean" match="com.dwrtest.service.Users">
<param name="include" value="userId,userName,password"/>
</convert>
</allow>
</dwr>
最后再抒写一个 dwrBean.jsp 文件:
Xml代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3C%25%40%20page%20language%3D%22java%22%20contentType%3D%22text%2Fhtml%3Bcharset%3DUTF-8%22%25%3E%0A%3C!DOCTYPE%20HTML%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20HTML%204.01%20Transitional%2F%2FEN%22%3E%0A%3Chtml%3E%0A%20%20%3Chead%3E%0A%20%20%20%20%3Ctitle%3EDwr%20Test%3C%2Ftitle%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Futil.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Fengine.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Finterface%2FdwrService.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%3E%0A%09%09%3C!--%5C%5C%0A%09%09function%20loginRObject()%7B%0A%09%09%09dwrService.login2(document.getElementById(%22userName%22).value%2Cdocument.getElementById%0A%0A(%22passWord%22).value%2CcellBackBean)%3B%0A%09%09%7D%0A%0A%09%09%2F%2F%20%E5%A4%84%E7%90%86%E8%BF%94%E5%9B%9E%E7%9A%84%E5%AE%9E%E4%BD%93%E5%AF%B9%E8%B1%A1%0A%09%09function%20cellBackBean(bean)%7B%0A%09%09%09DWRUtil.setValue(%22div%22%2C%22%E7%94%A8%E6%88%B7%E5%90%8D%3A%22%2Bbean.userName%2B%22%5Cn%20%E5%AF%86%20%20%E7%A0%81%3A%22%2Bbean.password)%3B%0A%09%09%7D%0A%09%09--%3E%0A%09%3C%2Fscript%3E%0A%09%3Cstyle%20type%3D%22text%2Fcss%22%3E%0A%09%3C!--%0A%09%09.FONT%7B%0A%09%09%09font-size%20%3A%2012px%3B%0A%09%09%7D%0A%09--%3E%0A%09%3C%2Fstyle%3E%0A%20%20%3C%2Fhead%3E%0A%20%20%3Cbody%3E%0A%20%20%3Cdiv%20id%3D%22div%22%20class%3D%22FONT%22%3E%3C%2Fdiv%3E%0A%20%20%20%20%20%3Ctable%20border%3D0%20class%3D%22FONT%22%3E%0A%20%20%20%20%20%09%3Ctr%3E%0A%20%20%20%20%20%09%09%3Ctd%20class%3D%22FONT%22%3EuserName%3A%3C%2Ftd%3E%0A%09%09%3Ctd%20class%3D%22FONT%22%3E%3Cinput%20type%3D%22text%22%20id%3D%22userName%22%20name%3D%22userName%22%3E%3C%2Ftd%3E%0A%20%20%20%20%20%09%3C%2Ftr%3E%0A%20%20%20%20%20%09%3Ctr%3E%0A%20%20%20%20%20%09%09%3Ctd%20class%3D%22FONT%22%3EpassWord%3A%3C%2Ftd%3E%0A%09%09%3Ctd%20class%3D%22FONT%22%3E%3Cinput%20type%3D%22text%22%20id%3D%22passWord%22%20name%3D%22passWord%22%3E%3C%2Ftd%3E%0A%20%20%20%20%20%09%3C%2Ftr%3E%0A%20%20%20%20%20%09%3Ctr%3E%0A%20%20%20%20%20%09%09%3Ctd%20colspan%3D2%3E%0A%20%20%20%20%20%09%09%09%3Cinput%20type%3D%22button%22%20value%3D%22login%22%20onclick%3D%22loginRObject()%3B%22%3E%0A%20%20%20%20%20%09%09%3C%2Ftd%3E%0A%20%20%20%20%20%09%3C%2Ftr%3E%0A%20%20%20%20%20%3C%2Ftable%3E%0A%20%20%3C%2Fbody%3E%0A%3C%2Fhtml%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. < %@ page language = "java" contentType = "text/html;charset=UTF-8" % >
2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
3. < html >
4. < head >
5. < title > Dwr Test </ title >
6. < script type = "text/javascript" src = "dwr/util.js" > </ script >
7. < script type = "text/javascript" src = "dwr/engine.js" > </ script >
8. < script type = "text/javascript" src = "dwr/interface/dwrService.js" > </ script >
9. < script type = "text/javascript" >
10. <!--\\
11. function loginRObject(){
12. dwrService.login2(document.getElementById("userName").value,document.getElementById
13.
14. ("passWord").value,cellBackBean);
15. }
16.
17. // 处理返回的实体对象
18. function cellBackBean(bean){
19. DWRUtil.setValue("div"," 用户名:"+bean.userName+"\n 密 码:"+bean.password);
20. }
21. -->
22. </ script >
23. < style type = "text/css" >
24. <!--
25. .FONT{
26. font-size : 12px;
27. }
28. -->
29. </ style >
30. </ head >
31. < body >
32. < div id = "div" class = "FONT" > </ div >
33. < table border = 0 class = "FONT" >
34. < tr >
35. < td class = "FONT" > userName: </ td >
36. < td class = "FONT" > < input type = "text" id = "userName" name = "userName" > </ td >
37. </ tr >
38. < tr >
39. < td class = "FONT" > passWord: </ td >
40. < td class = "FONT" > < input type = "text" id = "passWord" name = "passWord" > </ td >
41. </ tr >
42. < tr >
43. < td colspan = 2 >
44. < input type = "button" value = "login" onclick = "loginRObject();" >
45. </ td >
46. </ tr >
47. </ table >
48. </ body >
49. </ html >
<%@ page language="java" contentType="text/html;charset=UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Dwr Test</title>
<script type="text/javascript" src="dwr/util.js"></script>
<script type="text/javascript" src="dwr/engine.js"></script>
<script type="text/javascript" src="dwr/interface/dwrService.js"></script>
<script type="text/javascript">
<!--\\
function loginRObject(){
dwrService.login2(document.getElementById("userName").value,document.getElementById
("passWord").value,cellBackBean);
}
// 处理返回的实体对象
function cellBackBean(bean){
DWRUtil.setValue("div","用户名:"+bean.userName+"\n 密 码:"+bean.password);
}
-->
</script>
<style type="text/css">
<!--
.FONT{
font-size : 12px;
}
-->
</style>
</head>
<body>
<div id="div" class="FONT"></div>
<table border=0 class="FONT">
<tr>
<td class="FONT">userName:</td>
<td class="FONT"><input type="text" id="userName" name="userName"></td>
</tr>
<tr>
<td class="FONT">passWord:</td>
<td class="FONT"><input type="text" id="passWord" name="passWord"></td>
</tr>
<tr>
<td colspan=2>
<input type="button" value="login" onclick="loginRObject();">
</td>
</tr>
</table>
</body>
</html>
运行下看看吧!
三、返回列表对象
同样我们先来修改Dao.java 和 DwrService.java 二个文件添加方法 listByUsersAll:
Dao.java:
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=public%20List%3CUsers%3E%20listByUsersAll()%20%7B%0A%09List%3CUsers%3E%20list%20%3D%20new%20ArrayList%3CUsers%3E()%3B%0A%09Users%20users%20%3D%20new%20Users()%3B%0A%09users.setUserId(1)%3B%0A%09users.setUserName(%22chentao%22)%3B%0A%09users.setPassword(%22chentao%22)%3B%0A%09list.add(users)%3B%0A%09users%20%3D%20new%20Users()%3B%0A%09users.setUserId(2)%3B%0A%09users.setUserName(%22chen%22)%3B%0A%09users.setPassword(%22chen%22)%3B%0A%09list.add(users)%3B%0A%09return%20list%3B%0A%7D" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. public List<Users> listByUsersAll() {
2. List<Users> list = new ArrayList<Users>();
3. Users users = new Users();
4. users.setUserId(1 );
5. users.setUserName("chentao" );
6. users.setPassword("chentao" );
7. list.add(users);
8. users = new Users();
9. users.setUserId(2 );
10. users.setUserName("chen" );
11. users.setPassword("chen" );
12. list.add(users);
13. return list;
14. }
public List<Users> listByUsersAll() {
List<Users> list = new ArrayList<Users>();
Users users = new Users();
users.setUserId(1);
users.setUserName("chentao");
users.setPassword("chentao");
list.add(users);
users = new Users();
users.setUserId(2);
users.setUserName("chen");
users.setPassword("chen");
list.add(users);
return list;
}
DwrService.java:
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=public%20List%3CUsers%3E%20listByUsersAll()%20%7B%0A%20return%20dao.listByUsersAll()%3B%0A%7D" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. public List<Users> listByUsersAll() {
2. return dao.listByUsersAll();
3. }
public List<Users> listByUsersAll() {
return dao.listByUsersAll();
}
同样修改dwr.xml 文件:
Xml代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3Cdwr%3E%0A%20%3Callow%3E%0A%20%20%3Ccreate%20javascript%3D%22dwrService%22%20creator%3D%22new%22%3E%0A%20%20%20%3Cparam%20name%3D%22class%22%20value%3D%22dwrService%22%20%2F%3E%0A%20%20%3C%2Fcreate%3E%0A%20%20%3Cconvert%20converter%3D%22bean%22%20match%3D%22com.dwrtest.service.Users%22%3E%0A%20%20%20%3Cparam%20name%3D%22include%22%20value%3D%22userId%2CuserName%2Cpassword%22%2F%3E%0A%20%20%3C%2Fconvert%3E%0A%20%3C%2Fallow%3E%0A%20%3Csignatures%3E%0A%20%20%3C!%5BCDATA%5B%20%0A%20%20%20import%20java.util.List%3B%0A%20%20%20import%20com.dwrtest.service.DwrService%3B%0A%20%20%20import%20com.dwrtest.service.Users%3B%0A%20%20%5D%5D%3E%0A%20%3C%2Fsignatures%3E%0A%3C%2Fdwr%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. < dwr >
2. < allow >
3. < create javascript = "dwrService" creator = "new" >
4. < param name = "class" value = "dwrService" />
5. </ create >
6. < convert converter = "bean" match = "com.dwrtest.service.Users" >
7. < param name = "include" value = "userId,userName,password" />
8. </ convert >
9. </ allow >
10. < signatures >
11. <![CDATA[
12. import java.util.List;
13. import com.dwrtest.service.DwrService;
14. import com.dwrtest.service.Users;
15. ]]>
16. </ signatures >
17. </ dwr >
<dwr>
<allow>
<create javascript="dwrService" creator="new">
<param name="class" value="dwrService" />
</create>
<convert converter="bean" match="com.dwrtest.service.Users">
<param name="include" value="userId,userName,password"/>
</convert>
</allow>
<signatures>
<![CDATA[
import java.util.List;
import com.dwrtest.service.DwrService;
import com.dwrtest.service.Users;
]]>
</signatures>
</dwr>
同样需要写一个JSP来显示 dwrList.jsp
Html代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3C%25%40%20page%20language%3D%22java%22%20contentType%3D%22text%2Fhtml%3Bcharset%3DUTF-8%22%25%3E%0A%3C!DOCTYPE%20HTML%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20HTML%204.01%20Transitional%2F%2FEN%22%3E%0A%3Chtml%3E%0A%20%20%3Chead%3E%0A%20%20%20%20%3Ctitle%3EDwr%20Test%3C%2Ftitle%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Futil.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Fengine.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Finterface%2FdwrService.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%3E%0A%09%09%3C!--%5C%5C%0A%09%09function%20rList()%7B%0A%09%09%09dwrService.listByUsersAll(cellBackList)%3B%0A%09%09%7D%0A%09%09%2F%2F%20%E5%A4%84%E7%90%86%E8%BF%94%E5%9B%9E%E7%9A%84%E5%88%97%E8%A1%A8%E5%AF%B9%E6%98%8E%0A%09%09function%20cellBackList(list)%7B%0A%09%09%09var%20div%20%3D%20document.getElementById(%22div%22)%3B%0A%09%09%09var%20str%20%3D%20%22%22%3B%0A%09%09%09str%20%3D%20%22%3Ctable%3E%22%3B%0A%09%09%09str%20%2B%3D%20%22%3Ctr%3E%3Ctd%20class%3D'FONT'%3E%E7%94%A8%E6%88%B7ID%3C%2Ftd%3E%3Ctd%20class%3D'FONT'%3E%E7%94%A8%E6%88%B7%E5%90%8D%3C%2Ftd%3E%3Ctd%20class%3D'FONT'%3E%E5%AF%86%E7%A0%81%3C%2Ftd%3C%2Ftr%3E%22%3B%0A%09%09%09for(var%20i%20in%20list)%7B%0A%09%09%09%09var%20bean%20%3D%20list%5Bi%5D%3B%0A%09%09%09%09str%20%2B%3D%20%22%3Ctr%3E%3Ctd%20class%3D'FONT'%3E%22%2Bbean.userId%2B%22%3C%2Ftd%3E%3Ctd%20class%3D'FONT'%3E%22%2Bbean.userName%2B%22%3C%2Ftd%3E%3Ctd%20%0A%0Aclass%3D'FONT'%3E%22%2Bbean.password%2B%22%3C%2Ftd%3C%2Ftr%3E%22%3B%0A%09%09%09%7D%0A%09%09%09str%20%2B%3D%20%22%3C%2Ftable%3E%22%3B%0A%09%09%09div.innerHTML%20%3D%20str%3B%0A%09%09%7D%0A%09%09--%3E%0A%09%3C%2Fscript%3E%0A%09%3Cstyle%20type%3D%22text%2Fcss%22%3E%0A%09%3C!--%0A%09%09.FONT%7B%0A%09%09%09font-size%20%3A%2012px%3B%0A%09%09%7D%0A%09--%3E%0A%09%3C%2Fstyle%3E%0A%20%20%3C%2Fhead%3E%0A%20%20%3Cbody%3E%0A%20%20%09%3Cdiv%20id%3D%22div%22%20class%3D%22FONT%22%3E%3C%2Fdiv%3E%0A%20%20%20%20%20%09%3Cinput%20type%3D%22button%22%20value%3D%22%E8%BF%94%E5%9B%9E%E5%88%97%E8%A1%A8%22%20onclick%3D%22rList()%3B%22%3E%0A%20%20%3C%2Fbody%3E%0A%3C%2Fhtml%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. < %@ page language = "java" contentType = "text/html;charset=UTF-8" % >
2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
3. < html >
4. < head >
5. < title > Dwr Test </ title >
6. < script type = "text/javascript" src = "dwr/util.js" > </ script >
7. < script type = "text/javascript" src = "dwr/engine.js" > </ script >
8. < script type = "text/javascript" src = "dwr/interface/dwrService.js" > </ script >
9. < script type = "text/javascript" >
10. <!--\\
11. function rList(){
12. dwrService.listByUsersAll(cellBackList);
13. }
14. // 处理返回的列表对明
15. function cellBackList(list){
16. var div = document .getElementById("div");
17. var str = "" ;
18. str = "<table>" ;
19. str += "< tr > < td class = 'FONT' > 用户ID </ td > < td class = 'FONT' > 用户名 </ td > < td class = 'FONT' > 密码 </ td </ tr > ";
20. for(var i in list){
21. var bean = list [i];
22. str += "< tr > < td class = 'FONT' > "+bean.userId+" </ td > < td class = 'FONT' > "+bean.userName+" </ td > < td
23.
24. class = 'FONT' > "+bean.password+" </ td </ tr > ";
25. }
26. str += "</ table > ";
27. div.innerHTML = str ;
28. }
29. -->
30. </ script >
31. < style type = "text/css" >
32. <!--
33. .FONT{
34. font-size : 12px;
35. }
36. -->
37. </ style >
38. </ head >
39. < body >
40. < div id = "div" class = "FONT" > </ div >
41. < input type = "button" value = "返回列表" onclick = "rList();" >
42. </ body >
43. </ html >
<%@ page language="java" contentType="text/html;charset=UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Dwr Test</title>
<script type="text/javascript" src="dwr/util.js"></script>
<script type="text/javascript" src="dwr/engine.js"></script>
<script type="text/javascript" src="dwr/interface/dwrService.js"></script>
<script type="text/javascript">
<!--\\
function rList(){
dwrService.listByUsersAll(cellBackList);
}
// 处理返回的列表对明
function cellBackList(list){
var div = document.getElementById("div");
var str = "";
str = "<table>";
str += "<tr><td class='FONT'>用户ID</td><td class='FONT'>用户名</td><td class='FONT'>密码</td</tr>";
for(var i in list){
var bean = list[i];
str += "<tr><td class='FONT'>"+bean.userId+"</td><td class='FONT'>"+bean.userName+"</td><td
class='FONT'>"+bean.password+"</td</tr>";
}
str += "</table>";
div.innerHTML = str;
}
-->
</script>
<style type="text/css">
<!--
.FONT{
font-size : 12px;
}
-->
</style>
</head>
<body>
<div id="div" class="FONT"></div>
<input type="button" value="返回列表" onclick="rList();">
</body>
</html>
实现基本上以完成:运行下看看吧!
四、与SPRING集成
接下来我将来介绍下与SPRING 集成的一些方法:我们首先需要加入SPRING LIB 到工程目录下,在 MyEclipse 中可直接添加SPRING环境,修改
DwrService.java 中的 Dao 创建方式:
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=private%20IDao%20dao%3B%0A%0Apublic%20IDao%20getDao()%20%7B%0A%09return%20dao%3B%0A%7D%0A%0Apublic%20void%20setDao(IDao%20dao)%20%7B%0A%09this.dao%20%3D%20dao%3B%0A%7D%0A" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. private IDao dao;
2.
3. public IDao getDao() {
4. return dao;
5. }
6.
7. public void setDao(IDao dao) {
8. this .dao = dao;
9. }
private IDao dao;
public IDao getDao() {
return dao;
}
public void setDao(IDao dao) {
this.dao = dao;
}
applicationContext.xml:
Xml代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Cbeans%0A%09xmlns%3D%22http%3A%2F%2Fwww.springframework.org%2Fschema%2Fbeans%22%0A%09xmlns%3Axsi%3D%22http%3A%2F%2Fwww.w3.org%2F2001%2FXMLSchema-instance%22%0A%09xsi%3AschemaLocation%3D%22http%3A%2F%2Fwww.springframework.org%2Fschema%2Fbeans%20http%3A%2F%2Fwww.springframework.org%2Fschema%2Fbeans%2Fspring-%0A%0Abeans-2.0.xsd%22%3E%0A%09%3Cbean%20id%3D%22dao%22%20class%3D%22com.dwrtest.dao.impl.Dao%22%3E%0A%09%3C%2Fbean%3E%0A%09%3Cbean%20id%3D%22dwrService%22%20class%3D%22com.dwrtest.service.DwrService%22%3E%0A%09%09%3Cproperty%20name%3D%22dao%22%20ref%3D%22dao%22%3E%3C%2Fproperty%3E%0A%09%3C%2Fbean%3E%0A%3C%2Fbeans%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. <? xml version = "1.0" encoding = "UTF-8" ?>
2. < beans
3. xmlns = "http://www.springframework.org/schema/beans"
4. xmlns:xsi = "http://www.w3.org/2001/XMLSchema-instance"
5. xsi:schemaLocation ="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-
6.
7. beans-2.0.xsd">
8. < bean id = "dao" class = "com.dwrtest.dao.impl.Dao" >
9. </ bean >
10. < bean id = "dwrService" class = "com.dwrtest.service.DwrService" >
11. < property name = "dao" ref = "dao" > </ property >
12. </ bean >
13. </ beans >
<?xml version="1.0" encoding="UTF-8"?>
<beans
xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-
beans-2.0.xsd">
<bean id="dao" class="com.dwrtest.dao.impl.Dao">
</bean>
<bean id="dwrService" class="com.dwrtest.service.DwrService">
<property name="dao" ref="dao"></property>
</bean>
</beans>
最后需要修改dwr.xml:修改后的dwr.xml如下:
Xml代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3Cdwr%3E%0A%09%3Callow%3E%0A%09%09%3C!--%20creator%E6%8C%87%E6%98%8E%E4%B8%BA%E8%AF%A5%E5%AE%9E%E4%BD%93%E7%94%B1spring%E6%9D%A5%E5%88%9B%E5%BB%BA%2C%20param%20%E5%88%99%E6%8C%87%E5%90%91%E7%9A%84%E6%98%AFapplicationContext.xml%20%E7%9A%84%E7%9A%84%20bean%20id%20--%3E%0A%09%09%3Ccreate%20javascript%3D%22dwrService%22%20creator%3D%22spring%22%3E%0A%09%09%09%3Cparam%20name%3D%22beanName%22%20value%3D%22dwrService%22%20%2F%3E%0A%09%09%3C%2Fcreate%3E%0A%09%09%3Cconvert%20converter%3D%22bean%22%20match%3D%22com.dwrtest.service.Users%22%3E%0A%09%09%09%3Cparam%20name%3D%22include%22%20value%3D%22userId%2CuserName%2Cpassword%22%2F%3E%0A%09%09%3C%2Fconvert%3E%0A%09%3C%2Fallow%3E%0A%09%3Csignatures%3E%0A%09%09%3C!%5BCDATA%5B%20%0A%09%09%09import%20java.util.List%3B%0A%09%09%09import%20com.dwrtest.service.DwrService%3B%0A%09%09%09import%20com.dwrtest.service.Users%3B%0A%09%09%5D%5D%3E%0A%09%3C%2Fsignatures%3E%0A%3C%2Fdwr%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. < dwr >
2. < allow >
3. <!-- creator指明为该实体由spring来创建, param 则指向的是 applicationContext.xml 的的 bean id -->
4. < create javascript = "dwrService" creator = "spring" >
5. < param name = "beanName" value = "dwrService" />
6. </ create >
7. < convert converter = "bean" match = "com.dwrtest.service.Users" >
8. < param name = "include" value = "userId,userName,password" />
9. </ convert >
10. </ allow >
11. < signatures >
12. <![CDATA[
13. import java.util.List;
14. import com.dwrtest.service.DwrService;
15. import com.dwrtest.service.Users;
16. ]]>
17. </ signatures >
18. </ dwr >
<dwr>
<allow>
<!-- creator指明为该实体由spring来创建, param 则指向的是applicationContext.xml 的的 bean id -->
<create javascript="dwrService" creator="spring">
<param name="beanName" value="dwrService" />
</create>
<convert converter="bean" match="com.dwrtest.service.Users">
<param name="include" value="userId,userName,password"/>
</convert>
</allow>
<signatures>
<![CDATA[
import java.util.List;
import com.dwrtest.service.DwrService;
import com.dwrtest.service.Users;
]]>
</signatures>
</dwr>
可以看到修改后的dwr.xml 与前面的有所不同 在 create 元素中属性creator值改成spring ,参数param 也改为了 beanName,下面就着重来介
绍下该文件:
dwr:为配置文件的根元素
allow:该元素中包含了暴露给javascript访问的东西
create: 标签中指定javascript中可以访问的java类,并定义DWR应当如何获得要进行远程的类的实例。
creator="new"属性指定 java类实例的生成方式,new意味着DWR应当调用类的默认构造函数来获得实例,
其他的还有spring方式,通过与IOC容器 Spring进行集成来获得实例等等。
javascript="dwrService"表示实体转换成javascript语言后以这个来命名,页面中可以通过该名进行引用
<param>标签指定要公开给javascript的java类名。
<include> 标签指定要公开给javascript的方法。不指定的话就公开所有方法。
<exclude>标签指定要防止被访问的方法。
convert:<creator>标签负责公开用于Web远程的类和类的方法,
<convertor>标签则负责这些方法的参数和返回类型。
convert元素的作用是告诉DWR在服务器端Java 对象表示和序列化的JavaScript之间如何转换数据类型。
DWR自动地在Java和JavaScript表示之间调整简单数据类型。这些类型包括Java原生类型和它们各自的封装类表示,
还有String、Date、数组和集合类型。DWR也能把JavaBean转换成 JavaScript 表示,但是出于安全性的原因,
要求显式的配置,<convertor>标签就是完成此功能的。 converter="bean"属性指定转换的方式采用JavaBean命名规范,
match="com.dwrtest.service.Users" 属性指定要转换的javabean名称,<param>标签指定要转换的JavaBean属性。
singnatures:标签是用来声明java方法中List、Set或者Map参数所包含的确切类,以便java代码作出判断。
在JSP中使用时需要先对dwr提供的二个JS和生成的一个JS进行引用
Xml代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%20%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Futil.js%22%3E%3C%2Fscript%3E%0A%20%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Fengine.js%22%3E%3C%2Fscript%3E%0A%20%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Finterface%2FdwrService.js%22%3E%3C%2Fscript%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. < script type = "text/javascript" src = "dwr/util.js" > </ script >
2. < script type = "text/javascript" src = "dwr/engine.js" > </ script >
3. < script type = "text/javascript" src = "dwr/interface/dwrService.js" > </ script >
<script type="text/javascript" src="dwr/util.js"></script>
<script type="text/javascript" src="dwr/engine.js"></script>
<script type="text/javascript" src="dwr/interface/dwrService.js"></script>
其中 dwrService.js 为引用由DWR通过配置生成的JS文件
DWR(全称:Direct Web Remoting)是一个JavaEE模型的一个AJAX框架,通过配置和指定回调JavaScript函数并可直接调用服务端后台业务方法,
并得到是一个WEB远程调用框架.利用DWR框架可以让AJAX开发变得更加简单.DWR可以在客户端利用JavaScript直接调用服务端的 Java方法并返
回值给JavaScript就好像直接本地客户端调用一样(DWR根据Java类来动态生成JavaScrip代码).它的最新版本DWR3.0添加许多特性如:支持Dom
Trees的自动配置,支持Spring(通过配置可直接远程调用,从Spring Bean中获取业务对象),更好浏览器支持,还支持一个可选的commons-
logging日记操作.
该项目主页:http://www.getahead.ltd.uk/dwr/
目前该项目的正式版3.0以发布,可以到些去选择需要的版本进行下载:
http://directwebremoting.org/dwr/download.html
有了包那么下面我们来实现一个简单的例子来说明在实际应用中的方法,首先我按四大步来划分
1、调用服务端后台业务对象返回字符串
2、调用服务端后台业务对象并返回一个 Bean 对象
3、调用服务端后台业务对象返回列表
4、与SPRING进行集成,并同时实现以上3项同样业务
实现部分:
新建一个WEB工程,将下载的dwr.jar拷到项目的lib目录中,能后在WEB-INF目录下新建一个dwr.xml 文件,在web.xml 中添加一个DWR的请求控制
,接下来我会对dwr.xml中进行配置生成业务对象方式,我将不会加以注释详细说明,详细说明我将放在文章的最后面
Xml代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3Cservlet%3E%0A%09%3Cservlet-name%3Edwr%3C%2Fservlet-name%3E%0A%09%3Cservlet-class%3E%0A%09%09org.directwebremoting.servlet.DwrServlet%0A%09%3C%2Fservlet-class%3E%0A%09%3Cinit-param%3E%0A%09%09%3Cparam-name%3EDebug%3C%2Fparam-name%3E%0A%09%09%3Cparam-value%3Etrue%3C%2Fparam-value%3E%0A%09%3C%2Finit-param%3E%0A%3C%2Fservlet%3E%0A%3Cservlet-mapping%3E%0A%09%3Cservlet-name%3Edwr%3C%2Fservlet-name%3E%0A%09%3Curl-pattern%3E%2Fdwr%2F*%3C%2Furl-pattern%3E%0A%3C%2Fservlet-mapping%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. < servlet >
2. < servlet-name > dwr </ servlet-name >
3. < servlet-class >
4. org.directwebremoting.servlet.DwrServlet
5. </ servlet-class >
6. < init-param >
7. < param-name > Debug </ param-name >
8. < param-value > true </ param-value >
9. </ init-param >
10. </ servlet >
11. < servlet-mapping >
12. < servlet-name > dwr </ servlet-name >
13. < url-pattern > /dwr/* </ url-pattern >
14. </ servlet-mapping >
<servlet>
<servlet-name>dwr</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</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
再添加一个Users.java
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=package%20com.dwrtest.service%3B%0A%0A%2F**%0A%20*%20%3Cp%3E%0A%20*%20%E5%88%9B%20%E5%BB%BA%20%E4%BA%BA%EF%BC%9AChenTao%0A%20*%20%3Cp%3E%0A%20*%20%E5%88%9B%E5%BB%BA%E6%97%A5%E6%9C%9F%EF%BC%9A2009-5-26%20%E4%B8%8A%E5%8D%889%3A04%3A44%0A%20*%20%3Cp%3E%0A%20*%2F%0Apublic%20class%20Users%20%7B%0A%09%0A%09private%20Integer%20userId%3B%0A%09%0A%09private%20String%20userName%3B%0A%09%0A%09private%20String%20password%3B%0A%09%0A%09%2F%2Fget...%20set...%20%E6%96%B9%E6%B3%95%E7%95%A5%0A%7D" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. package com.dwrtest.service;
2.
3. /**
4. * <p>
5. * 创 建 人:ChenTao
6. * <p>
7. * 创建日期:2009-5-26 上午9:04:44
8. * <p>
9. */
10. public class Users {
11.
12. private Integer userId;
13.
14. private String userName;
15.
16. private String password;
17.
18. //get... set... 方法略
19. }
package com.dwrtest.service;
/**
* <p>
* 创 建 人:ChenTao
* <p>
* 创建日期:2009-5-26 上午9:04:44
* <p>
*/
public class Users {
private Integer userId;
private String userName;
private String password;
//get... set... 方法略
}
上面二个文件在全局中都会使用到,下面声明将不对这二个文件描述
好了我们先来实现第一步:
一、返回字符串
先新建一个Dao.java
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=package%20com.dwrtest.dao.impl%3B%0A%0Aimport%20java.util.ArrayList%3B%0Aimport%20java.util.List%3B%0A%0Aimport%20com.dwrtest.dao.IDao%3B%0Aimport%20com.dwrtest.service.Users%3B%0A%0Apublic%20class%20Dao%20implements%20IDao%7B%0A%09%0A%09public%20String%20login1(String%20userName%2C%20String%20password)%20%7B%0A%09%09if(%22ctojxzsycztao%22.equals(userName)%20%26%26%20%22ctojxzsycztao%22.equals(password))%7B%0A%09%09%09return%20%22%E7%99%BB%E5%BD%95%E6%88%90%E5%8A%9F!%22%3B%0A%09%09%7D%0A%09%09return%20%22%E7%99%BB%E5%BD%95%E5%A4%B1%E8%B4%A5!%22%3B%0A%09%7D%0A%7D" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. package com.dwrtest.dao.impl;
2.
3. import java.util.ArrayList;
4. import java.util.List;
5.
6. import com.dwrtest.dao.IDao;
7. import com.dwrtest.service.Users;
8.
9. public class Dao implements IDao{
10.
11. public String login1(String userName, String password) {
12. if ( "ctojxzsycztao" .equals(userName) && "ctojxzsycztao" .equals(password)){
13. return "登录成功!" ;
14. }
15. return "登录失败!" ;
16. }
17. }
package com.dwrtest.dao.impl;
import java.util.ArrayList;
import java.util.List;
import com.dwrtest.dao.IDao;
import com.dwrtest.service.Users;
public class Dao implements IDao{
public String login1(String userName, String password) {
if("ctojxzsycztao".equals(userName) && "ctojxzsycztao".equals(password)){
return "登录成功!";
}
return "登录失败!";
}
}
新建一个DwrService.java,代码如下:
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=package%20com.dwrtest.service%3B%0A%0Aimport%20com.dwrtest.dao.IDao%3B%0Aimport%20com.dwrtest.dao.impl.Dao%3B%0A%0A%2F**%0A%20*%20%3Cp%3E%0A%20*%20%E5%88%9B%20%E5%BB%BA%20%E4%BA%BA%EF%BC%9AChenTao%0A%20*%20%3Cp%3E%0A%20*%20%E5%88%9B%E5%BB%BA%E6%97%A5%E6%9C%9F%EF%BC%9A2009-5-26%20%E4%B8%8A%E5%8D%8809%3A38%3A51%0A%20*%20%3Cp%3E%0A%20*%2F%0Apublic%20class%20DwrService%20%7B%0A%0A%09private%20IDao%20dao%20%3D%20new%20Dao()%3B%0A%0A%09public%20IDao%20getDao()%20%7B%0A%09%09return%20dao%3B%0A%09%7D%0A%0A%09public%20void%20setDao(IDao%20dao)%20%7B%0A%09%09this.dao%20%3D%20dao%3B%0A%09%7D%0A%09public%20String%20login1(String%20userName%2CString%20password)%7B%0A%09%09return%20dao.login1(userName%2C%20password)%3B%0A%09%7D%0A%7D" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. package com.dwrtest.service;
2.
3. import com.dwrtest.dao.IDao;
4. import com.dwrtest.dao.impl.Dao;
5.
6. /**
7. * <p>
8. * 创 建 人:ChenTao
9. * <p>
10. * 创建日期:2009-5-26 上午09:38:51
11. * <p>
12. */
13. public class DwrService {
14.
15. private IDao dao = new Dao();
16.
17. public IDao getDao() {
18. return dao;
19. }
20.
21. public void setDao(IDao dao) {
22. this .dao = dao;
23. }
24. public String login1(String userName,String password){
25. return dao.login1(userName, password);
26. }
27. }
package com.dwrtest.service;
import com.dwrtest.dao.IDao;
import com.dwrtest.dao.impl.Dao;
/**
* <p>
* 创 建 人:ChenTao
* <p>
* 创建日期:2009-5-26 上午09:38:51
* <p>
*/
public class DwrService {
private IDao dao = new Dao();
public IDao getDao() {
return dao;
}
public void setDao(IDao dao) {
this.dao = dao;
}
public String login1(String userName,String password){
return dao.login1(userName, password);
}
}
修改dwr.xml 文件内容如下:
Xml代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3C!DOCTYPE%20dwr%20PUBLIC%20%22-%2F%2FGetAhead%20Limited%2F%2FDTD%20Direct%20Web%20Remoting%202.0%2F%2FEN%22%20%22http%3A%2F%2Fgetahead.org%2Fdwr%2Fdwr20.dtd%22%3E%0A%3Cdwr%3E%0A%09%3Callow%3E%0A%09%09%3Ccreate%20creator%3D%22new%22%20javascript%3D%22dwrService%22%3E%0A%09%09%09%3Cparam%20name%3D%22class%22%20value%3D%22com.dwrtest.service.DwrService%22%2F%3E%0A%09%09%3C%2Fcreate%3E%0A%09%3C%2Fallow%3E%0A%3C%2Fdwr%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. <? xml version = "1.0" encoding = "UTF-8" ?>
2. <!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr/dwr20.dtd">
3. < dwr >
4. < allow >
5. < create creator = "new" javascript = "dwrService" >
6. < param name = "class" value = "com.dwrtest.service.DwrService" />
7. </ create >
8. </ allow >
9. </ dwr >
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr/dwr20.dtd">
<dwr>
<allow>
<create creator="new" javascript="dwrService">
<param name="class" value="com.dwrtest.service.DwrService"/>
</create>
</allow>
</dwr>
最后创建一个dwrStr.jsp
Html代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3C%25%40%20page%20language%3D%22java%22%20contentType%3D%22text%2Fhtml%3Bcharset%3DUTF-8%22%25%3E%0A%3C!DOCTYPE%20HTML%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20HTML%204.01%20Transitional%2F%2FEN%22%3E%0A%3Chtml%3E%0A%20%20%3Chead%3E%0A%20%20%20%20%3Ctitle%3EDwr%20Test%3C%2Ftitle%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Futil.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Fengine.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Finterface%2FdwrService.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%3E%0A%09%09%3C!--%5C%5C%0A%09%09function%20login()%7B%0A%09%09%20%20%20%20%20dwrService.login1(document.getElementById(%22userName%22).value%2Cdocument.getElementById%0A%0A(%22passWord%22).value%2CcellBackStr)%3B%0A%09%09%7D%0A%0A%09%09%2F%2F%20%E5%A4%84%E7%90%86%E8%BF%94%E5%9B%9E%E7%9A%84%E5%AD%97%E7%AC%A6%E4%B8%B2%0A%09%09function%20cellBackStr(str)%7B%0A%09%09%09DWRUtil.setValue(%22div%22%2Cstr)%3B%0A%09%09%7D%0A%09%09--%3E%0A%09%3C%2Fscript%3E%0A%09%3Cstyle%20type%3D%22text%2Fcss%22%3E%0A%09%3C!--%0A%09%09.FONT%7Bfont-size%20%3A%2012px%3B%7D%0A%09--%3E%0A%09%3C%2Fstyle%3E%0A%20%20%3C%2Fhead%3E%0A%20%20%3Cbody%3E%0A%20%20%3Cdiv%20id%3D%22div%22%20class%3D%22FONT%22%3E%3C%2Fdiv%3E%0A%20%20%20%20%20%3Ctable%20border%3D0%20class%3D%22FONT%22%3E%0A%20%20%20%20%20%09%3Ctr%3E%0A%20%20%20%20%20%09%09%3Ctd%20class%3D%22FONT%22%3EuserName%3A%3C%2Ftd%3E%0A%09%09%3Ctd%20class%3D%22FONT%22%3E%3Cinput%20type%3D%22text%22%20id%3D%22userName%22%20name%3D%22userName%22%3E%3C%2Ftd%3E%0A%20%20%20%20%20%09%3C%2Ftr%3E%0A%20%20%20%20%20%09%3Ctr%3E%0A%20%20%20%20%20%09%09%3Ctd%20class%3D%22FONT%22%3EpassWord%3A%3C%2Ftd%3E%0A%09%09%3Ctd%20class%3D%22FONT%22%3E%3Cinput%20type%3D%22text%22%20id%3D%22passWord%22%20name%3D%22passWord%22%3E%3C%2Ftd%3E%0A%20%20%20%20%20%09%3C%2Ftr%3E%0A%20%20%20%20%20%09%3Ctr%3E%0A%20%20%20%20%20%09%09%3Ctd%20colspan%3D2%3E%0A%20%20%20%20%20%09%09%09%3Cinput%20type%3D%22button%22%20value%3D%22login%22%20onclick%3D%22login()%3B%22%3E%0A%20%20%20%20%20%09%09%3C%2Ftd%3E%0A%20%20%20%20%20%09%3C%2Ftr%3E%0A%20%20%20%20%20%3C%2Ftable%3E%0A%20%20%3C%2Fbody%3E%0A%3C%2Fhtml%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. < %@ page language = "java" contentType = "text/html;charset=UTF-8" % >
2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
3. < html >
4. < head >
5. < title > Dwr Test </ title >
6. < script type = "text/javascript" src = "dwr/util.js" > </ script >
7. < script type = "text/javascript" src = "dwr/engine.js" > </ script >
8. < script type = "text/javascript" src = "dwr/interface/dwrService.js" > </ script >
9. < script type = "text/javascript" >
10. <!--\\
11. function login(){
12. dwrService.login1(document.getElementById("userName").value,document.getElementById
13.
14. ("passWord").value,cellBackStr);
15. }
16.
17. // 处理返回的字符串
18. function cellBackStr(str){
19. DWRUtil.setValue("div",str);
20. }
21. -->
22. </ script >
23. < style type = "text/css" >
24. <!--
25. .FONT{font-size : 12px;}
26. -->
27. </ style >
28. </ head >
29. < body >
30. < div id = "div" class = "FONT" > </ div >
31. < table border = 0 class = "FONT" >
32. < tr >
33. < td class = "FONT" > userName: </ td >
34. < td class = "FONT" > < input type = "text" id = "userName" name = "userName" > </ td >
35. </ tr >
36. < tr >
37. < td class = "FONT" > passWord: </ td >
38. < td class = "FONT" > < input type = "text" id = "passWord" name = "passWord" > </ td >
39. </ tr >
40. < tr >
41. < td colspan = 2 >
42. < input type = "button" value = "login" onclick = "login();" >
43. </ td >
44. </ tr >
45. </ table >
46. </ body >
47. </ html >
<%@ page language="java" contentType="text/html;charset=UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Dwr Test</title>
<script type="text/javascript" src="dwr/util.js"></script>
<script type="text/javascript" src="dwr/engine.js"></script>
<script type="text/javascript" src="dwr/interface/dwrService.js"></script>
<script type="text/javascript">
<!--\\
function login(){
dwrService.login1(document.getElementById("userName").value,document.getElementById
("passWord").value,cellBackStr);
}
// 处理返回的字符串
function cellBackStr(str){
DWRUtil.setValue("div",str);
}
-->
</script>
<style type="text/css">
<!--
.FONT{font-size : 12px;}
-->
</style>
</head>
<body>
<div id="div" class="FONT"></div>
<table border=0 class="FONT">
<tr>
<td class="FONT">userName:</td>
<td class="FONT"><input type="text" id="userName" name="userName"></td>
</tr>
<tr>
<td class="FONT">passWord:</td>
<td class="FONT"><input type="text" id="passWord" name="passWord"></td>
</tr>
<tr>
<td colspan=2>
<input type="button" value="login" onclick="login();">
</td>
</tr>
</table>
</body>
</html>
大家看到上面的实现和配置都非常简单,易懂、易学,现在我们来看下第二步
二、返回Bean对象
首先在 Dao.java 与 DwrService.java文件中添加一个方法 login2
Dao.java 中的 login2 方法
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=public%20Users%20login2(String%20userName%2C%20String%20password)%20%7B%0A%09if%20(%22ctojxzsycztao%22.equals(userName)%20%26%26%20%22ctojxzsycztao%22.equals(password))%20%7B%0A%09%09Users%20users%20%3D%20new%20Users()%3B%0A%09%09users.setUserId(1)%3B%0A%09%09users.setUserName(%22chentao%22)%3B%0A%09%09users.setPassword(%22chentao%22)%3B%0A%09%09return%20users%3B%0A%09%7D%0A%09return%20null%3B%0A%7D" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. public Users login2(String userName, String password) {
2. if ( "ctojxzsycztao" .equals(userName) && "ctojxzsycztao" .equals(password)) {
3. Users users = new Users();
4. users.setUserId(1 );
5. users.setUserName("chentao" );
6. users.setPassword("chentao" );
7. return users;
8. }
9. return null ;
10. }
public Users login2(String userName, String password) {
if ("ctojxzsycztao".equals(userName) && "ctojxzsycztao".equals(password)) {
Users users = new Users();
users.setUserId(1);
users.setUserName("chentao");
users.setPassword("chentao");
return users;
}
return null;
}
DwrService.java 中的login2方法
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=public%20Users%20login2(String%20userName%2C%20String%20password)%20%7B%0A%09return%20dao.login2(userName%2C%20password)%3B%0A%7D" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. public Users login2(String userName, String password) {
2. return dao.login2(userName, password);
3. }
public Users login2(String userName, String password) {
return dao.login2(userName, password);
}
同样需要修改 dwr.xml 文件,修改后的内容如下:
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3Cdwr%3E%0A%09%3Callow%3E%0A%09%09%3Ccreate%20javascript%3D%22dwrService%22%20creator%3D%22new%22%3E%0A%09%09%09%3Cparam%20name%3D%22class%22%20value%3D%22dwrService%22%20%2F%3E%0A%09%09%3C%2Fcreate%3E%0A%09%09%3Cconvert%20converter%3D%22bean%22%20match%3D%22com.dwrtest.service.Users%22%3E%0A%09%09%09%3Cparam%20name%3D%22include%22%20value%3D%22userId%2CuserName%2Cpassword%22%2F%3E%0A%09%09%3C%2Fconvert%3E%0A%09%3C%2Fallow%3E%0A%3C%2Fdwr%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. <dwr>
2. <allow>
3. <create javascript="dwrService" creator= "new" >
4. <param name="class" value= "dwrService" />
5. </create>
6. <convert converter="bean" match= "com.dwrtest.service.Users" >
7. <param name="include" value= "userId,userName,password" />
8. </convert>
9. </allow>
10. </dwr>
<dwr>
<allow>
<create javascript="dwrService" creator="new">
<param name="class" value="dwrService" />
</create>
<convert converter="bean" match="com.dwrtest.service.Users">
<param name="include" value="userId,userName,password"/>
</convert>
</allow>
</dwr>
最后再抒写一个 dwrBean.jsp 文件:
Xml代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3C%25%40%20page%20language%3D%22java%22%20contentType%3D%22text%2Fhtml%3Bcharset%3DUTF-8%22%25%3E%0A%3C!DOCTYPE%20HTML%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20HTML%204.01%20Transitional%2F%2FEN%22%3E%0A%3Chtml%3E%0A%20%20%3Chead%3E%0A%20%20%20%20%3Ctitle%3EDwr%20Test%3C%2Ftitle%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Futil.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Fengine.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Finterface%2FdwrService.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%3E%0A%09%09%3C!--%5C%5C%0A%09%09function%20loginRObject()%7B%0A%09%09%09dwrService.login2(document.getElementById(%22userName%22).value%2Cdocument.getElementById%0A%0A(%22passWord%22).value%2CcellBackBean)%3B%0A%09%09%7D%0A%0A%09%09%2F%2F%20%E5%A4%84%E7%90%86%E8%BF%94%E5%9B%9E%E7%9A%84%E5%AE%9E%E4%BD%93%E5%AF%B9%E8%B1%A1%0A%09%09function%20cellBackBean(bean)%7B%0A%09%09%09DWRUtil.setValue(%22div%22%2C%22%E7%94%A8%E6%88%B7%E5%90%8D%3A%22%2Bbean.userName%2B%22%5Cn%20%E5%AF%86%20%20%E7%A0%81%3A%22%2Bbean.password)%3B%0A%09%09%7D%0A%09%09--%3E%0A%09%3C%2Fscript%3E%0A%09%3Cstyle%20type%3D%22text%2Fcss%22%3E%0A%09%3C!--%0A%09%09.FONT%7B%0A%09%09%09font-size%20%3A%2012px%3B%0A%09%09%7D%0A%09--%3E%0A%09%3C%2Fstyle%3E%0A%20%20%3C%2Fhead%3E%0A%20%20%3Cbody%3E%0A%20%20%3Cdiv%20id%3D%22div%22%20class%3D%22FONT%22%3E%3C%2Fdiv%3E%0A%20%20%20%20%20%3Ctable%20border%3D0%20class%3D%22FONT%22%3E%0A%20%20%20%20%20%09%3Ctr%3E%0A%20%20%20%20%20%09%09%3Ctd%20class%3D%22FONT%22%3EuserName%3A%3C%2Ftd%3E%0A%09%09%3Ctd%20class%3D%22FONT%22%3E%3Cinput%20type%3D%22text%22%20id%3D%22userName%22%20name%3D%22userName%22%3E%3C%2Ftd%3E%0A%20%20%20%20%20%09%3C%2Ftr%3E%0A%20%20%20%20%20%09%3Ctr%3E%0A%20%20%20%20%20%09%09%3Ctd%20class%3D%22FONT%22%3EpassWord%3A%3C%2Ftd%3E%0A%09%09%3Ctd%20class%3D%22FONT%22%3E%3Cinput%20type%3D%22text%22%20id%3D%22passWord%22%20name%3D%22passWord%22%3E%3C%2Ftd%3E%0A%20%20%20%20%20%09%3C%2Ftr%3E%0A%20%20%20%20%20%09%3Ctr%3E%0A%20%20%20%20%20%09%09%3Ctd%20colspan%3D2%3E%0A%20%20%20%20%20%09%09%09%3Cinput%20type%3D%22button%22%20value%3D%22login%22%20onclick%3D%22loginRObject()%3B%22%3E%0A%20%20%20%20%20%09%09%3C%2Ftd%3E%0A%20%20%20%20%20%09%3C%2Ftr%3E%0A%20%20%20%20%20%3C%2Ftable%3E%0A%20%20%3C%2Fbody%3E%0A%3C%2Fhtml%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. < %@ page language = "java" contentType = "text/html;charset=UTF-8" % >
2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
3. < html >
4. < head >
5. < title > Dwr Test </ title >
6. < script type = "text/javascript" src = "dwr/util.js" > </ script >
7. < script type = "text/javascript" src = "dwr/engine.js" > </ script >
8. < script type = "text/javascript" src = "dwr/interface/dwrService.js" > </ script >
9. < script type = "text/javascript" >
10. <!--\\
11. function loginRObject(){
12. dwrService.login2(document.getElementById("userName").value,document.getElementById
13.
14. ("passWord").value,cellBackBean);
15. }
16.
17. // 处理返回的实体对象
18. function cellBackBean(bean){
19. DWRUtil.setValue("div"," 用户名:"+bean.userName+"\n 密 码:"+bean.password);
20. }
21. -->
22. </ script >
23. < style type = "text/css" >
24. <!--
25. .FONT{
26. font-size : 12px;
27. }
28. -->
29. </ style >
30. </ head >
31. < body >
32. < div id = "div" class = "FONT" > </ div >
33. < table border = 0 class = "FONT" >
34. < tr >
35. < td class = "FONT" > userName: </ td >
36. < td class = "FONT" > < input type = "text" id = "userName" name = "userName" > </ td >
37. </ tr >
38. < tr >
39. < td class = "FONT" > passWord: </ td >
40. < td class = "FONT" > < input type = "text" id = "passWord" name = "passWord" > </ td >
41. </ tr >
42. < tr >
43. < td colspan = 2 >
44. < input type = "button" value = "login" onclick = "loginRObject();" >
45. </ td >
46. </ tr >
47. </ table >
48. </ body >
49. </ html >
<%@ page language="java" contentType="text/html;charset=UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Dwr Test</title>
<script type="text/javascript" src="dwr/util.js"></script>
<script type="text/javascript" src="dwr/engine.js"></script>
<script type="text/javascript" src="dwr/interface/dwrService.js"></script>
<script type="text/javascript">
<!--\\
function loginRObject(){
dwrService.login2(document.getElementById("userName").value,document.getElementById
("passWord").value,cellBackBean);
}
// 处理返回的实体对象
function cellBackBean(bean){
DWRUtil.setValue("div","用户名:"+bean.userName+"\n 密 码:"+bean.password);
}
-->
</script>
<style type="text/css">
<!--
.FONT{
font-size : 12px;
}
-->
</style>
</head>
<body>
<div id="div" class="FONT"></div>
<table border=0 class="FONT">
<tr>
<td class="FONT">userName:</td>
<td class="FONT"><input type="text" id="userName" name="userName"></td>
</tr>
<tr>
<td class="FONT">passWord:</td>
<td class="FONT"><input type="text" id="passWord" name="passWord"></td>
</tr>
<tr>
<td colspan=2>
<input type="button" value="login" onclick="loginRObject();">
</td>
</tr>
</table>
</body>
</html>
运行下看看吧!
三、返回列表对象
同样我们先来修改Dao.java 和 DwrService.java 二个文件添加方法 listByUsersAll:
Dao.java:
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=public%20List%3CUsers%3E%20listByUsersAll()%20%7B%0A%09List%3CUsers%3E%20list%20%3D%20new%20ArrayList%3CUsers%3E()%3B%0A%09Users%20users%20%3D%20new%20Users()%3B%0A%09users.setUserId(1)%3B%0A%09users.setUserName(%22chentao%22)%3B%0A%09users.setPassword(%22chentao%22)%3B%0A%09list.add(users)%3B%0A%09users%20%3D%20new%20Users()%3B%0A%09users.setUserId(2)%3B%0A%09users.setUserName(%22chen%22)%3B%0A%09users.setPassword(%22chen%22)%3B%0A%09list.add(users)%3B%0A%09return%20list%3B%0A%7D" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. public List<Users> listByUsersAll() {
2. List<Users> list = new ArrayList<Users>();
3. Users users = new Users();
4. users.setUserId(1 );
5. users.setUserName("chentao" );
6. users.setPassword("chentao" );
7. list.add(users);
8. users = new Users();
9. users.setUserId(2 );
10. users.setUserName("chen" );
11. users.setPassword("chen" );
12. list.add(users);
13. return list;
14. }
public List<Users> listByUsersAll() {
List<Users> list = new ArrayList<Users>();
Users users = new Users();
users.setUserId(1);
users.setUserName("chentao");
users.setPassword("chentao");
list.add(users);
users = new Users();
users.setUserId(2);
users.setUserName("chen");
users.setPassword("chen");
list.add(users);
return list;
}
DwrService.java:
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=public%20List%3CUsers%3E%20listByUsersAll()%20%7B%0A%20return%20dao.listByUsersAll()%3B%0A%7D" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. public List<Users> listByUsersAll() {
2. return dao.listByUsersAll();
3. }
public List<Users> listByUsersAll() {
return dao.listByUsersAll();
}
同样修改dwr.xml 文件:
Xml代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3Cdwr%3E%0A%20%3Callow%3E%0A%20%20%3Ccreate%20javascript%3D%22dwrService%22%20creator%3D%22new%22%3E%0A%20%20%20%3Cparam%20name%3D%22class%22%20value%3D%22dwrService%22%20%2F%3E%0A%20%20%3C%2Fcreate%3E%0A%20%20%3Cconvert%20converter%3D%22bean%22%20match%3D%22com.dwrtest.service.Users%22%3E%0A%20%20%20%3Cparam%20name%3D%22include%22%20value%3D%22userId%2CuserName%2Cpassword%22%2F%3E%0A%20%20%3C%2Fconvert%3E%0A%20%3C%2Fallow%3E%0A%20%3Csignatures%3E%0A%20%20%3C!%5BCDATA%5B%20%0A%20%20%20import%20java.util.List%3B%0A%20%20%20import%20com.dwrtest.service.DwrService%3B%0A%20%20%20import%20com.dwrtest.service.Users%3B%0A%20%20%5D%5D%3E%0A%20%3C%2Fsignatures%3E%0A%3C%2Fdwr%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. < dwr >
2. < allow >
3. < create javascript = "dwrService" creator = "new" >
4. < param name = "class" value = "dwrService" />
5. </ create >
6. < convert converter = "bean" match = "com.dwrtest.service.Users" >
7. < param name = "include" value = "userId,userName,password" />
8. </ convert >
9. </ allow >
10. < signatures >
11. <![CDATA[
12. import java.util.List;
13. import com.dwrtest.service.DwrService;
14. import com.dwrtest.service.Users;
15. ]]>
16. </ signatures >
17. </ dwr >
<dwr>
<allow>
<create javascript="dwrService" creator="new">
<param name="class" value="dwrService" />
</create>
<convert converter="bean" match="com.dwrtest.service.Users">
<param name="include" value="userId,userName,password"/>
</convert>
</allow>
<signatures>
<![CDATA[
import java.util.List;
import com.dwrtest.service.DwrService;
import com.dwrtest.service.Users;
]]>
</signatures>
</dwr>
同样需要写一个JSP来显示 dwrList.jsp
Html代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3C%25%40%20page%20language%3D%22java%22%20contentType%3D%22text%2Fhtml%3Bcharset%3DUTF-8%22%25%3E%0A%3C!DOCTYPE%20HTML%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20HTML%204.01%20Transitional%2F%2FEN%22%3E%0A%3Chtml%3E%0A%20%20%3Chead%3E%0A%20%20%20%20%3Ctitle%3EDwr%20Test%3C%2Ftitle%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Futil.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Fengine.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Finterface%2FdwrService.js%22%3E%3C%2Fscript%3E%0A%09%3Cscript%20type%3D%22text%2Fjavascript%22%3E%0A%09%09%3C!--%5C%5C%0A%09%09function%20rList()%7B%0A%09%09%09dwrService.listByUsersAll(cellBackList)%3B%0A%09%09%7D%0A%09%09%2F%2F%20%E5%A4%84%E7%90%86%E8%BF%94%E5%9B%9E%E7%9A%84%E5%88%97%E8%A1%A8%E5%AF%B9%E6%98%8E%0A%09%09function%20cellBackList(list)%7B%0A%09%09%09var%20div%20%3D%20document.getElementById(%22div%22)%3B%0A%09%09%09var%20str%20%3D%20%22%22%3B%0A%09%09%09str%20%3D%20%22%3Ctable%3E%22%3B%0A%09%09%09str%20%2B%3D%20%22%3Ctr%3E%3Ctd%20class%3D'FONT'%3E%E7%94%A8%E6%88%B7ID%3C%2Ftd%3E%3Ctd%20class%3D'FONT'%3E%E7%94%A8%E6%88%B7%E5%90%8D%3C%2Ftd%3E%3Ctd%20class%3D'FONT'%3E%E5%AF%86%E7%A0%81%3C%2Ftd%3C%2Ftr%3E%22%3B%0A%09%09%09for(var%20i%20in%20list)%7B%0A%09%09%09%09var%20bean%20%3D%20list%5Bi%5D%3B%0A%09%09%09%09str%20%2B%3D%20%22%3Ctr%3E%3Ctd%20class%3D'FONT'%3E%22%2Bbean.userId%2B%22%3C%2Ftd%3E%3Ctd%20class%3D'FONT'%3E%22%2Bbean.userName%2B%22%3C%2Ftd%3E%3Ctd%20%0A%0Aclass%3D'FONT'%3E%22%2Bbean.password%2B%22%3C%2Ftd%3C%2Ftr%3E%22%3B%0A%09%09%09%7D%0A%09%09%09str%20%2B%3D%20%22%3C%2Ftable%3E%22%3B%0A%09%09%09div.innerHTML%20%3D%20str%3B%0A%09%09%7D%0A%09%09--%3E%0A%09%3C%2Fscript%3E%0A%09%3Cstyle%20type%3D%22text%2Fcss%22%3E%0A%09%3C!--%0A%09%09.FONT%7B%0A%09%09%09font-size%20%3A%2012px%3B%0A%09%09%7D%0A%09--%3E%0A%09%3C%2Fstyle%3E%0A%20%20%3C%2Fhead%3E%0A%20%20%3Cbody%3E%0A%20%20%09%3Cdiv%20id%3D%22div%22%20class%3D%22FONT%22%3E%3C%2Fdiv%3E%0A%20%20%20%20%20%09%3Cinput%20type%3D%22button%22%20value%3D%22%E8%BF%94%E5%9B%9E%E5%88%97%E8%A1%A8%22%20onclick%3D%22rList()%3B%22%3E%0A%20%20%3C%2Fbody%3E%0A%3C%2Fhtml%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. < %@ page language = "java" contentType = "text/html;charset=UTF-8" % >
2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
3. < html >
4. < head >
5. < title > Dwr Test </ title >
6. < script type = "text/javascript" src = "dwr/util.js" > </ script >
7. < script type = "text/javascript" src = "dwr/engine.js" > </ script >
8. < script type = "text/javascript" src = "dwr/interface/dwrService.js" > </ script >
9. < script type = "text/javascript" >
10. <!--\\
11. function rList(){
12. dwrService.listByUsersAll(cellBackList);
13. }
14. // 处理返回的列表对明
15. function cellBackList(list){
16. var div = document .getElementById("div");
17. var str = "" ;
18. str = "<table>" ;
19. str += "< tr > < td class = 'FONT' > 用户ID </ td > < td class = 'FONT' > 用户名 </ td > < td class = 'FONT' > 密码 </ td </ tr > ";
20. for(var i in list){
21. var bean = list [i];
22. str += "< tr > < td class = 'FONT' > "+bean.userId+" </ td > < td class = 'FONT' > "+bean.userName+" </ td > < td
23.
24. class = 'FONT' > "+bean.password+" </ td </ tr > ";
25. }
26. str += "</ table > ";
27. div.innerHTML = str ;
28. }
29. -->
30. </ script >
31. < style type = "text/css" >
32. <!--
33. .FONT{
34. font-size : 12px;
35. }
36. -->
37. </ style >
38. </ head >
39. < body >
40. < div id = "div" class = "FONT" > </ div >
41. < input type = "button" value = "返回列表" onclick = "rList();" >
42. </ body >
43. </ html >
<%@ page language="java" contentType="text/html;charset=UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Dwr Test</title>
<script type="text/javascript" src="dwr/util.js"></script>
<script type="text/javascript" src="dwr/engine.js"></script>
<script type="text/javascript" src="dwr/interface/dwrService.js"></script>
<script type="text/javascript">
<!--\\
function rList(){
dwrService.listByUsersAll(cellBackList);
}
// 处理返回的列表对明
function cellBackList(list){
var div = document.getElementById("div");
var str = "";
str = "<table>";
str += "<tr><td class='FONT'>用户ID</td><td class='FONT'>用户名</td><td class='FONT'>密码</td</tr>";
for(var i in list){
var bean = list[i];
str += "<tr><td class='FONT'>"+bean.userId+"</td><td class='FONT'>"+bean.userName+"</td><td
class='FONT'>"+bean.password+"</td</tr>";
}
str += "</table>";
div.innerHTML = str;
}
-->
</script>
<style type="text/css">
<!--
.FONT{
font-size : 12px;
}
-->
</style>
</head>
<body>
<div id="div" class="FONT"></div>
<input type="button" value="返回列表" onclick="rList();">
</body>
</html>
实现基本上以完成:运行下看看吧!
四、与SPRING集成
接下来我将来介绍下与SPRING 集成的一些方法:我们首先需要加入SPRING LIB 到工程目录下,在 MyEclipse 中可直接添加SPRING环境,修改
DwrService.java 中的 Dao 创建方式:
Java代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=private%20IDao%20dao%3B%0A%0Apublic%20IDao%20getDao()%20%7B%0A%09return%20dao%3B%0A%7D%0A%0Apublic%20void%20setDao(IDao%20dao)%20%7B%0A%09this.dao%20%3D%20dao%3B%0A%7D%0A" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. private IDao dao;
2.
3. public IDao getDao() {
4. return dao;
5. }
6.
7. public void setDao(IDao dao) {
8. this .dao = dao;
9. }
private IDao dao;
public IDao getDao() {
return dao;
}
public void setDao(IDao dao) {
this.dao = dao;
}
applicationContext.xml:
Xml代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Cbeans%0A%09xmlns%3D%22http%3A%2F%2Fwww.springframework.org%2Fschema%2Fbeans%22%0A%09xmlns%3Axsi%3D%22http%3A%2F%2Fwww.w3.org%2F2001%2FXMLSchema-instance%22%0A%09xsi%3AschemaLocation%3D%22http%3A%2F%2Fwww.springframework.org%2Fschema%2Fbeans%20http%3A%2F%2Fwww.springframework.org%2Fschema%2Fbeans%2Fspring-%0A%0Abeans-2.0.xsd%22%3E%0A%09%3Cbean%20id%3D%22dao%22%20class%3D%22com.dwrtest.dao.impl.Dao%22%3E%0A%09%3C%2Fbean%3E%0A%09%3Cbean%20id%3D%22dwrService%22%20class%3D%22com.dwrtest.service.DwrService%22%3E%0A%09%09%3Cproperty%20name%3D%22dao%22%20ref%3D%22dao%22%3E%3C%2Fproperty%3E%0A%09%3C%2Fbean%3E%0A%3C%2Fbeans%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. <? xml version = "1.0" encoding = "UTF-8" ?>
2. < beans
3. xmlns = "http://www.springframework.org/schema/beans"
4. xmlns:xsi = "http://www.w3.org/2001/XMLSchema-instance"
5. xsi:schemaLocation ="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-
6.
7. beans-2.0.xsd">
8. < bean id = "dao" class = "com.dwrtest.dao.impl.Dao" >
9. </ bean >
10. < bean id = "dwrService" class = "com.dwrtest.service.DwrService" >
11. < property name = "dao" ref = "dao" > </ property >
12. </ bean >
13. </ beans >
<?xml version="1.0" encoding="UTF-8"?>
<beans
xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-
beans-2.0.xsd">
<bean id="dao" class="com.dwrtest.dao.impl.Dao">
</bean>
<bean id="dwrService" class="com.dwrtest.service.DwrService">
<property name="dao" ref="dao"></property>
</bean>
</beans>
最后需要修改dwr.xml:修改后的dwr.xml如下:
Xml代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%3Cdwr%3E%0A%09%3Callow%3E%0A%09%09%3C!--%20creator%E6%8C%87%E6%98%8E%E4%B8%BA%E8%AF%A5%E5%AE%9E%E4%BD%93%E7%94%B1spring%E6%9D%A5%E5%88%9B%E5%BB%BA%2C%20param%20%E5%88%99%E6%8C%87%E5%90%91%E7%9A%84%E6%98%AFapplicationContext.xml%20%E7%9A%84%E7%9A%84%20bean%20id%20--%3E%0A%09%09%3Ccreate%20javascript%3D%22dwrService%22%20creator%3D%22spring%22%3E%0A%09%09%09%3Cparam%20name%3D%22beanName%22%20value%3D%22dwrService%22%20%2F%3E%0A%09%09%3C%2Fcreate%3E%0A%09%09%3Cconvert%20converter%3D%22bean%22%20match%3D%22com.dwrtest.service.Users%22%3E%0A%09%09%09%3Cparam%20name%3D%22include%22%20value%3D%22userId%2CuserName%2Cpassword%22%2F%3E%0A%09%09%3C%2Fconvert%3E%0A%09%3C%2Fallow%3E%0A%09%3Csignatures%3E%0A%09%09%3C!%5BCDATA%5B%20%0A%09%09%09import%20java.util.List%3B%0A%09%09%09import%20com.dwrtest.service.DwrService%3B%0A%09%09%09import%20com.dwrtest.service.Users%3B%0A%09%09%5D%5D%3E%0A%09%3C%2Fsignatures%3E%0A%3C%2Fdwr%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. < dwr >
2. < allow >
3. <!-- creator指明为该实体由spring来创建, param 则指向的是 applicationContext.xml 的的 bean id -->
4. < create javascript = "dwrService" creator = "spring" >
5. < param name = "beanName" value = "dwrService" />
6. </ create >
7. < convert converter = "bean" match = "com.dwrtest.service.Users" >
8. < param name = "include" value = "userId,userName,password" />
9. </ convert >
10. </ allow >
11. < signatures >
12. <![CDATA[
13. import java.util.List;
14. import com.dwrtest.service.DwrService;
15. import com.dwrtest.service.Users;
16. ]]>
17. </ signatures >
18. </ dwr >
<dwr>
<allow>
<!-- creator指明为该实体由spring来创建, param 则指向的是applicationContext.xml 的的 bean id -->
<create javascript="dwrService" creator="spring">
<param name="beanName" value="dwrService" />
</create>
<convert converter="bean" match="com.dwrtest.service.Users">
<param name="include" value="userId,userName,password"/>
</convert>
</allow>
<signatures>
<![CDATA[
import java.util.List;
import com.dwrtest.service.DwrService;
import com.dwrtest.service.Users;
]]>
</signatures>
</dwr>
可以看到修改后的dwr.xml 与前面的有所不同 在 create 元素中属性creator值改成spring ,参数param 也改为了 beanName,下面就着重来介
绍下该文件:
dwr:为配置文件的根元素
allow:该元素中包含了暴露给javascript访问的东西
create: 标签中指定javascript中可以访问的java类,并定义DWR应当如何获得要进行远程的类的实例。
creator="new"属性指定 java类实例的生成方式,new意味着DWR应当调用类的默认构造函数来获得实例,
其他的还有spring方式,通过与IOC容器 Spring进行集成来获得实例等等。
javascript="dwrService"表示实体转换成javascript语言后以这个来命名,页面中可以通过该名进行引用
<param>标签指定要公开给javascript的java类名。
<include> 标签指定要公开给javascript的方法。不指定的话就公开所有方法。
<exclude>标签指定要防止被访问的方法。
convert:<creator>标签负责公开用于Web远程的类和类的方法,
<convertor>标签则负责这些方法的参数和返回类型。
convert元素的作用是告诉DWR在服务器端Java 对象表示和序列化的JavaScript之间如何转换数据类型。
DWR自动地在Java和JavaScript表示之间调整简单数据类型。这些类型包括Java原生类型和它们各自的封装类表示,
还有String、Date、数组和集合类型。DWR也能把JavaBean转换成 JavaScript 表示,但是出于安全性的原因,
要求显式的配置,<convertor>标签就是完成此功能的。 converter="bean"属性指定转换的方式采用JavaBean命名规范,
match="com.dwrtest.service.Users" 属性指定要转换的javabean名称,<param>标签指定要转换的JavaBean属性。
singnatures:标签是用来声明java方法中List、Set或者Map参数所包含的确切类,以便java代码作出判断。
在JSP中使用时需要先对dwr提供的二个JS和生成的一个JS进行引用
Xml代码 < type="application/x-shockwave-flash" width="14" height="15" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" src="http://ctojxzsycztao.iteye.com/javascripts/syntaxhighlighter/clipboard_new.swf" flashvars="clipboard=%20%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Futil.js%22%3E%3C%2Fscript%3E%0A%20%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Fengine.js%22%3E%3C%2Fscript%3E%0A%20%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22dwr%2Finterface%2FdwrService.js%22%3E%3C%2Fscript%3E" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" width="14" height="15">
1. < script type = "text/javascript" src = "dwr/util.js" > </ script >
2. < script type = "text/javascript" src = "dwr/engine.js" > </ script >
3. < script type = "text/javascript" src = "dwr/interface/dwrService.js" > </ script >
<script type="text/javascript" src="dwr/util.js"></script>
<script type="text/javascript" src="dwr/engine.js"></script>
<script type="text/javascript" src="dwr/interface/dwrService.js"></script>
其中 dwrService.js 为引用由DWR通过配置生成的JS文件