六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 32|回复: 0

spring与dwr(ajax框架)的结合

[复制链接]

升级  38%

5

主题

5

主题

5

主题

童生

Rank: 1

积分
19
 楼主| 发表于 2013-1-23 01:31:04 | 显示全部楼层 |阅读模式
首先导入2个包 dwr.jar, common-logging.jar ,然后从dwr的src.zip中找到engine.js 和 util.js 将这两个js文件放入自己项目的js文件夹下。
在web.xml中:
<servlet><servlet-name>DWRServlet</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>DWRServlet</servlet-name><url-pattern>/dwr/*</url-pattern></servlet-mapping>同时新建一个applicationContext-dwr.xml文件,作为使用ajax与前端进行交互的类的bean容器。(如果不与spring集成,则忽略该步骤)
在applicationContext-dwr.xml中:
<?xml version="1.0" encoding="UTF-8"?><beansxmlns="http://www.springframework.org/schema/beans"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xmlns:p="http://www.springframework.org/schema/p"xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-2.5.xsd"><bean id="DWRRegister" class="com.swu.cateTime.core.web.register.DWRRegister"></bean></beans> 此时,在web-inf目录下,新建一个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><create javascript="register" creator="spring"><param name="beanName" value="DWRRegister" /><include method="isRepeatName"/></create><convert converter="bean" match="com.swu.cateTime.core.vo.common.MessageVO" ></convert></allow></dwr> <convert>标签作为有返回值时,声明返回Bean的标签,<param name="beanName" value="DWRRegister" /> value的值为在applicationContext-dwr.xml注入的类的id。
 
如果不用spring,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><create creator="new" javascript="fuck" ><param name="class" value="com.dwr.DWRTest"/><include method="say"/><exclude method="show"/></create></allow></dwr> <param name="class" value="com.dwr.DWRTest"/> value的内容为类的全限定名。
 
OK,此时我们运行项目,http://localhost:8080/工程名/dwr,进入测试页面,如果测试成功则能正确显示出来需要返回的值。
 
写js页面
首先导入三个js文件
<script type="text/javascript" src="dwr/engine.js"></script>
<script type="text/javascript" src="dwr/interface/register.js"></script>
<script type="text/javascript" src="dwr/util.js"></script>
第二个为DWR框架根据配置文件自动生成的
 
function checkUsername(){var username = document.getElementById("username").value;var patrn = [a-zA-Z0-9]{6,12};if(!patrn.exec(username)){            alert("用户名只能包含6-12个字母或数字");document.getElementById("username").focus();return false;}//alert(username);register.isRepeatName(username,isRepeatName);} register是在dwr.xml下配置的 javascript="register"function isRepeatName(messageVO){//alert(messageVO.message);    var target = document.getElementById("nameMessage");   if(messageVO.flag == true){     target.innerHTML = messageVO.message;     target.style.color="green";    }else if(messageVO.flag == false){     target.innerHTML = messageVO.message;     target.style.color="red";    }   } 
 register.isRepeatName(username,isRepeatName);
前面为参数,即DWRRegister的方法,后面为回调函数。
 
OK 大功告成!
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表