dwr:检查注册时用户是否已存在，再取后台的用户集合List并显示
1、新建一个web project， 名称：dwrDemo, 并将dwr.jar和commons-logging.jar复制到WEB-INF/lib中
2、在web.xml中配置。这一部分好像是死的，以后需要就直接复制吧。
<?xml version="1.0" encoding="UTF-8"?> <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> <!-- dwr的配置 开始--> <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> <!-- dwr的配置 结束--> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> </web-app>
<!--l version="1.0" encoding="UTF-8-->
3、建立判定用户是否存在的类及方法
package com.aptech.jb.biz;
public class UserManager {
public boolean check(String uname){
return uname.equals("leaf")?true:false;
}
}
4、配置dwr.xml
<?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> <!-- 指定生成的js文件的名称 --> <create creator="new" javascript="JUserChecker"> <!-- 指定要调用哪一个类 --> <param name="class" value="com.aptech.jb.biz.UserManager" /> <!-- 指定要调用哪一个方法 --> <include method="check" /> </create> </allow> </dwr>
<!--l version="1.0" encoding="UTF-8-->
5、在IE中输入http://localhost:8080/dwrDemo/dwr
点进去看一下, 下面是比较关键一点的代码:
6、编写页面代码index.jsp
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
<html>
<head>
<title>注册页面</title>
<script type='text/javascript' src='/dwrDemo/dwr/interface/JUserChecker.js'></script>
<script type='text/javascript' src='/dwrDemo/dwr/engine.js'></script>
<script type='text/javascript' src='/dwrDemo/dwr/util.js'></script>
<script type="text/javascript">
function checkUserExists(oCtl){
var uname=oCtl.value;
JUserChecker.check(uname,callback);
}
function callback(isExist){
alert(isExist?'用户名已存在':'用户名可以使用');
}
</script>
</head>
<body>
<form action="#" name="myform">
姓名:<input type="text" name="name" onblur="checkUserExists(this)" /><br/>
密码:<input type="text" name="name" /><br/>
<input type="submit" value="注册" />
</form>
</body>
</html>
-------------------------------下面是如何时用dwr得到后台的list-------------------------------------
1、继续上面的项目，做后台的取数据List的方法和一个实体类
package com.aptech.jb.biz;
import java.util.ArrayList;
import java.util.List;
import entity.User;
public class UserManager {
public boolean check(String uname){
return uname.equals("leaf")?true:false;
}
public List getAllUsers() {
User user1 =new User("张三","广州");
User user2 =new User("张飞","北京");
User user3 =new User("刘备","上海");
User user4 =new User("关羽","山东");
User user5 =new User("关平","山东");
User user6 =new User("曹操","广州");
User user7 =new User("吕晓","广州");
List<User> list =new ArrayList<User>();
list.add(user1);
list.add(user2);
list.add(user3);
list.add(user4);
list.add(user5);
list.add(user6);
list.add(user7);
return list;
}
}
//-----------------------------------------
package entity;
public class User {
private String uname;
private String address;
public String getUname() {
return uname;
}
public void setUname(String uname) {
this.uname = uname;
}
public String getAddress() {
return address;
}
public void setAddress(String address) {
this.address = address;
}
public User() {}
public User(String uname, String address) {
this.uname = uname;
this.address = address;
}
}
2、配置dwr.xml---注意要多配一个转换器
<?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> <!-- 指定生成的js文件的名称 --> <create creator="new" javascript="JUserChecker"> <!-- 指定要调用哪一个类 --> <param name="class" value="com.aptech.jb.biz.UserManager" /> <!-- 指定要调用哪一个方法 --> <include method="check" /> </create> <!-- 指定生成的js文件的名称 --> <create creator="new" javascript="JGetAllUsers"> <!-- 指定要调用哪一个类 --> <param name="class" value="com.aptech.jb.biz.UserManager" /> <!-- 指定要调用哪一个方法 --> <include method="getAllUsers" /> </create> <!-- 转换器 ，用来转换list中的对象--> <convert match="entity.User" converter="bean" /> </allow> </dwr>
3、页面代码getList.jsp：
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
<html>
<head>
<title>注册页面</title>
<script type='text/javascript' src='/dwrDemo/dwr/interface/JGetAllUsers.js'></script>
<script type='text/javascript' src='/dwrDemo/dwr/engine.js'></script>
<script type='text/javascript' src='/dwrDemo/dwr/util.js'></script>
<script type="text/javascript">
function getList(){
JGetAllUsers.getAllUsers(callback);
}
//注:1.data是上面的JGetAllUsers.getAllUsers方法得到的返回值
// 2.返回值是数组,而不是list
function callback(data){
var txtdiv="";
for(i=0;i<data.length;i++){
var uname=data[i].uname;
var address=data[i].address;
txtdiv=txtdiv+"姓名：<font color='blue'>"
+uname+"</font> 地址:<font color='pink'>"
+address+"</font><br>"
}
document.getElementById("userlist").innerHTML=txtdiv;
document.getElementById("userlist").style.display="block";
}
</script>
</head>
<body>
<a href="javascript:getList()">显示用户 </a><br>
<div id="userlist" style="display:none"></div>
</body>
</html>
4、最终页面效果：
