Extjs中的Dwr入门操作

preview
需积分: 0 4 下载量 112 浏览量 更新于2009-12-03 收藏 263KB DOC 举报
### Extjs中的Dwr入门操作详解 #### 一、DWR简介与安装配置 DWR (Direct Web Remoting) 是一款强大的开源JavaScript库,能够轻松地实现浏览器端JavaScript调用服务器端Java对象的功能,简化了AJAX编程。本文旨在帮助初学者理解如何在Extjs项目中集成并使用DWR。 ##### 1.1 DWR安装步骤 **步骤1:导入DWR JAR文件** - 将DWR的JAR文件放入Web应用的`WEB-INF/lib`目录中。 **步骤2:修改`web.xml`配置** - 在`web.xml`文件中添加DWR Servlet声明和映射,例如: ```xml <servlet> <servlet-name>dwr-invoker</servlet-name> <servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class> <init-param> <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> ``` - 设置DWR为调试模式,这可以通过将`debug`参数设置为`true`来实现。 ##### 1.2 配置文件`dwr.xml`设置 **步骤3:创建`dwr.xml`配置文件** - 创建`dwr.xml`文件,定义哪些Java对象可以被JavaScript调用。 ```xml <dwr> <allow> <convert converter="bean" match="com.yd.pojos.Userss"/> <create creator="new" javascript="userAction" class="com.yd.imp.UserCol"> <include method="getALlUser"/> </create> </allow> </dwr> ``` - `<convert>`元素用于指定哪些对象类型可以被转换成JSON格式的数据。 - `<create>`元素用于声明可以被JavaScript调用的Java对象,`javascript`属性表示在JavaScript中调用该对象的名称。 - `<include>`元素用于指定可以被调用的具体方法。 #### 二、基本客户端发送与接收数据流程 接下来介绍如何实现基本的客户端发送数据和接收数据的过程。 ##### 2.1 创建处理类 **步骤4:编写Java处理类** - 创建一个简单的Java类,如`TestDWR`,提供可以被JavaScript调用的方法。 ```java package com.yd.colbean; public class TestDWR { public String getHello(String name) { return "你好:" + name; } } ``` **步骤5:配置`dwr.xml`** - 在`dwr.xml`中暴露Java处理类的方法。 ```xml <dwr> <allow> <create creator="new" javascript="TestDWR" class="com.yd.colbean.TestDWR"> <include method="getHello"/> </create> </allow> </dwr> ``` ##### 2.2 编写客户端脚本 **步骤6:编写客户端脚本** - 在JSP页面中引入必要的DWR JavaScript库,并编写调用Java方法的脚本。 ```html <script type='text/javascript' src='/TestDWR1/dwr/interface/TestDWR.js'></script> <script type='text/javascript' src='/TestDWR1/dwr/engine.js'></script> <script type='text/javascript' src='/TestDWR1/dwr/util.js'></script> <script type='text/javascript'> function sayHello() { dwr.util.callScript('/TestDWR1/dwr/call/plaincall/TestDWR.getHello', {name: '张三'}, function(response) { alert(response); }); } </script> ``` - 使用`dwr.util.callScript`函数来调用Java方法,并处理返回的结果。 通过以上步骤,您已经成功实现了Extjs项目中DWR的基本使用。DWR不仅可以简化AJAX开发,还提供了丰富的功能,比如事件监听、错误处理等,这些高级特性将在后续的文章中详细介绍。
woshifou
  • 粉丝: 20
  • 资源: 7
上传资源 快速赚钱
voice
center-task 前往需求广场,查看用户热搜