发表时间:2008-11-12
最后修改:2008-11-12
初学Ajax开源框架DWR,使用2.0.5版本,新建web项目dwrtest
下载地址:http://directwebremoting.org/dwr/download
中文文档:http://wiki.javascud.org/display/dwrcn/Home
1.配置web.xml文件,配置一个servlet
* <servlet-name>dwr</servlet-name>
<servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
<url-pattern>/dwr/*</url-pattern>
* 复制dwr.jar和commons-logging-*.jar文件到lib目录
2.新建处理类,并把该类配置到dwr.xml文件里,dwr.xml文件从源代码中复制到WEB-INF目录
* 处理类名UserAjax,一个方法:检查参数,然后返回结果如Boolean
配置dwr.xml:页面端可以通过"userAjax"访问这个类方法并得到返回结果
<allow>
<create javascript="userAjax" creator="new">
<param name="class" value="com.wfy.dwr.UserAjax"/>
</create>
</allow>
3.编写页面端jsp或html,利用JavaScript技术
* 这里的配置格式固定,是约定src="dwr/engine.js"是必须的,它处理所有与服务器的通信
这里使用了相对路径
<script type="text/javascript" src="dwr/engine.js"></script>
<script type="text/javascript" src="dwr/interface/userAjax.js"></script>
<!-- 这里的dwr/interface/也是约定,userAjax.js也是框架自动生成我们只需在此引用就可以 -->
* 还有一个可选配置util.js: 帮你使用从服务器取来的数据改变页面(还有一些灵巧的小功能)
<script type="text/javascript" src="dwr/util.js"></script>
* 用javascript脚本编写Ajax回调函数,接收返回值并处理
function callback(boolean){
if(boolean){
${"error"}.style.visibility="hidden";
}else{
${"error"}.style.visibility="visible";
form1.username.value="";
}
}
* 用JavaScript脚本编写调用处理类的函数
function validate(){
var name = form1.username.value;
//这个是调用dwr.xml配置里的处理类的方法
userAjax.existUser(name,callback);
}
这条语句的主要功能:1.传递页面端的内容给服务端处理类的方法
2.指明了回调函数是callback
* 表单form1.username的onchange="validate()"
当username输入框内容改变失去焦点后,这个方法就会执行,然后由框架动态生成的
脚本方法就会把我们输入的值发送给服务端,服务端接收到request分析地址是/dwr/*
找到我们在web.xml里配置的DWRservlet处理请求后将结果返回给页面端
* 框架自动生成的脚本参见http://localhost:8080/dwrtest/dwr/
dwr/interface/userAjax.js内容为:
// Provide a default path to dwr.engine
if (dwr == null) var dwr = {};
if (dwr.engine == null) dwr.engine = {};
if (DWREngine == null) var DWREngine = dwr.engine;
if (userAjax == null) var userAjax = {};
userAjax._path = '/dwrtest/dwr';
userAjax.existUser = function(p0, callback) {
dwr.engine._execute(userAjax._path, 'userAjax', 'existUser', p0, callback);
}
dwr/engine.js关于此方法描述
/**
* @private Send a request. Called by the Javascript interface stub
* @param path part of URL after the host and before the exec bit without leading or trailing /s
* @param scriptName The class to execute
* @param methodName The method on said class to execute
* @param func The callback function to which any returned data should be passed
* if this is null, any returned data will be ignored
* @param vararg_params The parameters to pass to the above class
*/
dwr.engine._execute = function(path, scriptName, methodName, vararg_params) {