ajax 开源项目 DWR

mengyuan760

浏览: 18166 次
来自: ...

最近访客更多访客>>

cefcs

博主相关

博客

微博

相册

留言

关于我

文章分类

全部博客 (15)

社区版块

存档分类

DWR Ajax JavaScript Servlet Web

ajax开源项目dwr的使用：
利用DWR可以在客户端利用JavaScript直接调用服务端的Java方法并返回值
给JavaScript就好像直接本地客户端调用一样.

1：下载dwr.jar文件，将其加入到web工程的lib下；
2：在web.xml文件中配置如下信息：
  <servlet>
   <servlet-name>dwr-invoker</servlet-name>
   <servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class>
  </servlet>
  <servlet-mapping>
   <servlet-name>dwr-invoker</servlet-name>
   <url-pattern>/dwr/*</url-pattern>
  </servlet-mapping>
    其中url-pattern中必须配置为 “/dwr/* ”，不能为工程的名称！！

3：在web.xml同级中增加文件dwr.xml，此文件是javaScript中调用的方法，影射到class类
  例如：
   <!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="MyTest" scope="application">
          <param name="class" value="com.test.ajax.DWRTest"/>
       </create>
       <create scope="application" creator="new" javascript="showData">
        <param name="class" value="com.test.ajax.HelloName"/>
       </create>
   </allow>
  </dwr>
在allow节点中定义要影射的class类，并且给其class类起一个javaScript的名字，以便在
javaScript中调用。

4：然后定义class文件
  package com.test.ajax;
  public class DWRTest
  {
   public DWRTest(){

    }
    public String getMyName(){
     return "hello_ajax";
    }
  }

  /**
  *---------------------------------------------------
  **/
  package com.test.ajax;
  public class HelloName
  {
   private String userName ;
   public HelloName(){
   }
   /**
    * @return Returns the userName.
    */
   public String getUserName()
   {
    return "helloTest";
   }
   /**
    * @param userName The userName to set.
    */
   public void setUserName(String userName)
   {
    this.userName = userName;
   }
  }
5: 这时就可以在html或jsp中调用此class文件了，调用方式如下
  一下为测试的 html文件

   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
   <html>
   <head>
     <title>DWR - My First AJAX</title>
     <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
     <script type='text/javascript' src='dwr/interface/MyTest.js'></script>
     <script type='text/javascript' src='dwr/interface/showData.js'></script>
     <script type='text/javascript' src='dwr/engine.js'></script>
     <script type='text/javascript' src='dwr/util.js'></script>
     <script language="javascript">
      var mycall=function callBack(data){
      DWRUtil.setValue("demo1",data);
      DWRUtil.setValue("demo2","leo_wang");
      DWRUtil.setValue("userName",data);
      }
      function showMyName(){
       //MyTest.getMyName(mycall);
       showData.getUserName(mycall);
      }

      function clearName(){
       demo1.value="";
       demo2.value="";
      }
     </script>
     </head>
   <body>
   <h1>Ajax Test Page</h1>
   <input type="button" value="setMyName" onclick="javascript:showMyName()">
   <input type="button" value="Clear" onclick="javascript:clearName()"><br>
   <input type="text" id="demo1">
   <input type="text" id="demo2">
   <input type="test" id="userName">userName
   </body></html>

  在调用javaScript前要先引入刚才在dwr.xml中定义的javaScript
  <script type='text/javascript' src='dwr/interface/MyTest.js'></script>
  <script type='text/javascript' src='dwr/interface/showData.js'></script>
  <script type='text/javascript' src='dwr/engine.js'></script>
  <script type='text/javascript' src='dwr/util.js'></script>
  前面两行是我们刚才定义的javaScript的引入，后面两行是dwr中的本身定义的javaScript

  ok(完）

分享到：