编辑Java类
package org.lucifer.dwr;
import org.directwebremoting.annotations.Param;
import org.directwebremoting.annotations.RemoteMethod;
import org.directwebremoting.annotations.RemoteProxy;
import org.directwebremoting.annotations.ScriptScope;
import org.directwebremoting.create.NewCreator;
@RemoteProxy(creator=NewCreator.class, name="service", scope=ScriptScope.PAGE,
creatorParams=@Param(name="class", value="org.lucifer.dwr.AjaxService"))
public class AjaxService {
@RemoteMethod
public String welcome(String yourName) {
StringBuilder sb = new StringBuilder("欢迎使用DWR应用示例,你是:");
sb.append(yourName).append(".");
return sb.toString();
}
}
编辑配置web.xml文件
要应用DWR框架,首先需要在web.xml文件中设置DWR,以下配置必须被添加到WEB-INF/web.xml文件中。在web.xml文件中设置DWR内容如下:
<servlet>
<description>配置DWR核心Servlet</description>
<servlet-name>dwr-invoker</servlet-name>
<!-- 指定DWR核心Servlet的实现类 -->
<servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
<init-param>
<description>指定Web应用中要使用的DWR传输对象类和代理类</description>
<param-name>classes</param-name>
<param-value>org.lucifer.dwr.AjaxService</param-value>
</init-param>
<init-param>
<description>指定DWR核心Servlet是否处于Debug状态</description>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>dwr-invoker</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
编写JSP
创建JSP文件,在文件中使用DWR需要注意以下事项:
- 要引用DWR的JS文件,其中engine.js是必须要引用的文件,如果需要用到DWR提供的一些工具,还需要引用util.js文件。
- 然后还要引用句DWR自动生成的JS文件,例如:dwr/interface/service.js,注意JS文件名要与Java类中的注解中定义的name属性一致。
- JS里的service.welcome()方法和Java类的方法有一个区别,即多了一个参数,用来回调返回的数据。
下面是调用AjaxService类的welcome()方法的JSP文件示例,实现代码如下:
<%@page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:set var="basePath" value="${pageContext.servletContext.contextPath}"/>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8"/>
<title>DWR 示例</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script type="text/javascript">jQuery.noConflict();</script>
<script type="text/javascript" src="${basePath}/dwr/engine.js"></script>
<script type="text/javascript" src="${basePath}/dwr/interface/service.js"></script>
<script type="text/javascript" src="js/dwr_simple.js"></script>
<script type="text/javascript" src="${basePath}/dwr/util.js"></script>
</head>
<body>
<form id="myForm" name="myForm">
<label for="user">请输入名字:</label>
<input type="text" name="user" id="user" autocomplete="on" placeholder="请输入名字"/>
<button type="button" name="clickMe" id="clickMe">测试</button>
</form>
<footer>
<p><div id="console"></div></p>
</footer>
</body>
</html>
编写JavaScript文件
var logger = function(msg) {
jQuery("<strong>").append(msg).after("<br/>").appendTo("#console");
};
jQuery(function() {
var callbackHandler = {
callback:function(data) {
logger("进入回调函数.");
jQuery("<span>").append(data).after("<br/>").prependTo("#console");
logger("退出回调函数.");
},
errorHandler:function(msg) {
logger("进入错误处理函数");
jQuery("<strong>").append(msg).after("<br/>").appendTo("#console");
logger("退出错误处理函数");
},
timeout:2000
};
var handler = function(event) {
logger("进入事件处理函数.");
var nameText = jQuery("#user").val();
if(nameText != "") {
logger("准备调用DWR方法");
service.welcome(nameText, callbackHandler);
logger("DWR方法执行完成");
} else {
alert("注意:名字字段不能为空!");
}
logger("退出事件处理函数.");
};
jQuery("#myForm").submit(function(event) {
logger("触发onsubmit事件");
handler(event);
logger("完成onsubmit事件");
this.stopPropagation();
return false;
});
jQuery("#clickMe").click(function(event) {
logger("触发onclick事件");
handler(event);
logger("完成onclick事件");
});
});
分享到:
相关推荐
DWR (Direct Web Remoting) 是一个开源的Java库,它允许JavaScript在浏览器端与服务器端的Java对象进行交互,实现动态的Web应用。...这对于想要学习和使用DWR来构建动态Web应用的初学者来说是一个很好的起点。
通过本文的详细介绍,我们了解了DWR的基本安装与配置过程,以及在使用过程中需要注意的细节。DWR通过简化Ajax开发流程,使得前后端交互变得更加直接与高效。遵循上述步骤,你可以快速上手DWR,实现更高级的Ajax功能...
Direct Web Remoting (DWR) 是一种开源的Java库,它...以上就是DWR包的使用入门,从安装配置到实际调用,涵盖了一个完整的DWR应用开发流程。通过学习和实践,你可以更好地理解和利用DWR来构建高效、交互性强的Web应用。
**DWR(Direct Web Remoting)技术文档** DWR,全称Direct Web Remoting,是一种在Web应用程序中实现...通过理解其核心功能、配置步骤以及使用流程,开发者可以快速地在项目中引入DWR,构建高效、动态的Web应用。
在提供的“AJAX框架DWR简单应用.pdf”文件中,你可能会找到关于如何设置DWR环境、编写Java接口、配置DWR配置文件、在前端JavaScript中使用DWR,以及示例代码和实际运行效果的详细教程。这个文件是学习和理解DWR工作...
9. **实战项目**:“[浪曦原创]零散视频三 使用DWR开发AJAX For J2EE(JustCode).wrf”可能是一个实际操作视频,详细演示如何使用DWR构建一个简单的AJAX应用,通过观看可以加深对上述理论知识的理解。 10. **资源...
`ajax登录`可能是一个实际的DWR应用示例,展示如何实现无刷新的登录功能。`dwrdemo`可能是一个完整的DWR演示项目,包含运行示例的源代码。`dwr需要用的jar`是DWR运行所需的库文件。`Ajax无刷新页的业务逻辑实现`可能...
DWR (Direct Web Remoting) 是一种开源Java技术,它允许Web应用程序在浏览器和服务器之间进行实时、双向...在自学过程中,理解DWR的工作原理、熟练运用其主要组件以及掌握实际应用场景,都将对你的IT职业生涯大有裨益。
本文通过一个具体的示例——无限级树型菜单的实现,展示了如何使用DWR框架简化AJAX应用的开发过程。该示例主要涉及以下几个步骤: 1. **服务器端Java类设计**:首先需要定义服务器端的Java类,这些类包含了将被...
在"Ajaxapp"这个实例中,很可能是演示了如何结合使用DWR和Dojo来创建一个基于Ajax的应用。可能包含了使用Dojo创建交互式的前端界面,以及通过DWR实现前后端数据交换的代码示例。学习这个实例可以帮助你理解这两个...
通过阅读这份中文教程并实践其中的示例,你将能够熟练地在你的Web应用中使用DWR,提升用户体验,同时也能深入理解AJAX技术在实际开发中的应用。记得实践是检验知识的最好方式,动手操作并结合理论知识,你将在DWR的...
**目的**:通过一个简单的“Hello World”示例来了解DWR的基本使用流程。 **步骤**: 1. **准备环境**:确保已安装Java开发环境,并且服务器支持运行Java Servlet。 2. **下载DWR库**:从官方站点或其他可信源下载...
在DWR的配置过程中,主要涉及到两个关键文件:`dwr.xml`和`web.xml`。`dwr.xml`是DWR的核心配置文件,它定义了哪些Java类和方法可以被JavaScript访问。例如: ```xml <dwrfactory name="dwr"> <!-- 允许访问...
同时,DWR提供了丰富的API和工具,简化了前后端的交互流程,提高了开发效率。 在实际项目中,将dwr.jar添加到项目的类路径中,然后在web.xml中配置DWR的servlet,最后根据项目需求调整dwr.xml文件,就可以开始利用...
在这里,它包含了对dwr.jar和其他可能的依赖项的引用,这对于在Eclipse环境中开发和调试DWR应用至关重要。 4. **.project**:这是Eclipse项目的配置文件,定义了项目的类型、构建设置、nature(特性)等信息,帮助...
这个"TestDwr"压缩包文件提供的例子是一个简单的DWR应用示例,适合初学者理解和学习。 1. **DWR基本概念**: - DWR的核心组件包括`DWR Engine`、`Reverse AJAX`和`JavaBeans`。 - `DWR Engine`是DWR的核心,它...
Direct Web Remoting (DWR) 是一个开源Java库,它允许Web应用程序在浏览器和服务器之间进行安全、简单、异步的通信。DWR的核心功能是将JavaScript与Java方法直接绑定,使得前端开发者能够调用服务器端的方法,就像...
通过以上步骤,我们成功实现了DWR的基本使用流程。DWR不仅简化了Java与JavaScript之间的交互,还提高了开发效率。在实际项目中,DWR可以用于实现复杂的异步操作,如实时数据更新、表单验证等。此外,它还可以与其他...