`
daohao123
  • 浏览: 56987 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

DWR相关说明

阅读更多
1. $("id") 大概等价于document.getElementById("id") 如果返回结果唯一的话返回该元素的值,不唯一则返回一个数组 .另外,如果单独使用util.js的话,可能在IE5以下的浏览器中无法正常使用,需要跟engine.js配合使用. 注意,这里得到的是一个对象,如果需要得到该对象的值的话,需要用innerHTML来取得.或者直接用DWRUtil.getValue("elementId")来取值.
    2.. DWRUtil.toDescriptiveString("elementId",debugLevel),这是一个debug用的函数.第一个参数是元素的id,第二个参数是debug等级,可以是0,1,2.随着等级增加,输出信息也会增加.注意这个函数只是一个debug工具,不要对它抱有太大幻想.
    3.. DWRUtil.getText("elementId"),返回一个select下拉菜单中的text值.仅适用于select类型的元素.
    4.. DWRUtil.getValue("elementId"),返回一个元素的值,This method works for most HTML elements including selects (where the option with a matching value and not text is selected), input elements (including textareas) divs and spans
    6.. DWRUtil.onReturn(event, submitFunction) 定义在输入框中按回车的响应,防止执行submit.
    7.DWRUtil.getValues({
       div:null,
       textarea:null,
       select:null,
       text:null,
       password:null,
       formbutton:null,
       button:null
      })
      这个函数可以自动取得页面上指定ID的值,并且返回一个java中可以认识的map(Hashtable或HashMap)值.下面是我测试示例;

页面:
      saveuser.htm
      <html>
      <head>
      <title>
      saveUser
      </title>
      <!--dwr/engine.js是dwr的核心引擎脚本处理客户端调用的转换-->
      <script src="/oblog312/dwr/interface/SaveUserAction.js" type="text/j avascript"></script>
      <script src="/oblog312/dwr/engine.js" type="text/j avascript"></script>
      <!--dwr/util.js包含了工具函数简化页面处理-->
      <script src="/oblog312/dwr/util.js" type="text/j avascript"></script>
      <script type="text/j avascript">
      function saveuser() {
         //user = { id:"", firstName:"", lastName:"", birthday:"" };
         user = { id:null, firstName:null, lastName:null, birthday:null };
         var params = DWRUtil.getValues(user);
         alert(params);
         SaveUserAction.PutParams(params);
         alert("user.id:"+user.id);
         alert("user.firstName:"+user.firstName);
         alert("user.lastName:"+user.lastName);
         alert("user.birthday:"+user.birthday);
      }
      function hello(ok) {
         alert(ok);
      }
      </script>
      </head>
      <body bgcolor="#ffffff">
      <form action="" id="userForm" name="userForm" method="POST">
      ID:<input type="text" id="id" name="id" /><br />
      姓:<input type="text" id="firstName" name="firstName" /><br />
      名:<input type="text" id="lastName" name="lastName" /><br />
      出生日期:<input type="text" id="birthday" name="birthday" /><br />
      <input type="submit" onclick="saveuser()"/>
      </form>
      </body>
      </html>
      action部分(SaveUserAction.java):
      package com.action;
      import org.apache.struts.action.ActionMapping;
      import org.apache.struts.action.ActionForm;
      import javax.servlet.http.HttpServletRequest;
      import javax.servlet.http.HttpServletResponse;
      import org.apache.struts.action.ActionForward;
      import com.actionform.SaveUserActionForm;
      import org.apache.struts.action.Action;
      import java.util.*;
      public class SaveUserAction extends Action {
         public ActionForward execute(ActionMapping mapping, ActionForm form,
                                      HttpServletRequest request,
                                      HttpServletResponse response) {
             SaveUserActionForm saveUserActionForm = (SaveUserActionForm) form;
             throw new java.lang.UnsupportedOperationException(
                     "Method $execute() not yet implemented.");
          }
        
         public String PutParams(Hashtable hash,HttpServletRequest request){
             Enumeration hashenum = hash.keys();
             while (hashenum.hasMoreElements()) {
               String name = (String) hashenum.nextElement();
               System.out.println("name:"+name);
               String value = (String) hash.get(name);
               System.out.println("value:"+value);
              }       
             return "成功";
          }
        
      }

      重要的dwr.xml配置部分:
         <create creator="new" javascript="SaveUserAction">
           <param name="class" value="/oblog312/com.action.SaveUserAction"/>
           <include method="PutParams"/>
         </create>
DWRUtil.addRows()的用法:

     8... DWRUtil.addRows(”items”,items,cellFunctions);
      第一个items,应该是table的id,第2个items,是远程返回的结果集,cellFunctions对表格行填充的回调函数一类的。(格式化行)
var cellFunctions = [ function(item) { return item.name; },
      function(item) { return item.description; },
      function(item) { return item.formattedPrice; },
      function(item) { var btn = document.createElement(”button”); btn.innerHTML = “Add to cart”; btn.itemId = item.id; btn.onclick = addToCartButtonHandler; return btn; }
      应该是一个function(item)就代表一列,return的就是传入的结果集的某列的内容。那么这个表格就应该有4列。最后一列是静态的html代码了。不过没研究一下,return回去动静混合的内容,就是一个字串会如何。我猜应该也可以吧。 

util.js  util.js包含了一些使用的方法,从而帮助你利用j avascript(可能)从服务器端更新你的web数据。
       你可以在DWR之外的地方使用它,因为它并不依赖与DWR而实现。
       它包含四个页面处理函数:getValue (id)、setValue(id,value)作用于除tables、lists和images以外的大多数html元素。getText()作用于select lists。
       addRows()和removeAllRows()用于编辑tables。addOptions()和removeAllOptions()用于编辑lists(如:select lists、ul、ol)。
      $()
       $函数(在javascript中,他的名字是合法的)的思想是从prototype引进的。一般说来,$ = document.getElementById。在以后你花大量时间进行ajax编程的时候,在合适的地方使用这种格式是很有益的。
       '$'通过给定的ID在当前HTML页面找到元素,如果多于一个的参数被提交,它就会返回一个包含已找到元素的数组。这个函数从prototype的library中得到的灵感,而且,它还能更好的工作在不同的浏览器中。
      Generating Lists
       DWR的一个功能可以给一个下拉列表(select list)添加选项,只需使用DWRUtil.addOptions()。
       如果你在更新列表之前,希望保留一些选项,你需要写以下一些代码:
           var sel = DWRUtil.getValue(id);
           DWRUtil.removeAllOptions(id);
           DWRUtil.addOptions(id, ...);
           DWRUtil.setValue(id, sel);
       如果你想有个初始化选项,如:“please select”,你可以直接使用:
     9.. DWRUtil.addOptions(id, ["Please select"]);
      DWRUtil.addOptions 有5种调用方法:
Array: DWRUtil.addOptions(selectid, array) 。selectid为目标ID,array为每一项的text。
      Array of objects (option text = option value): DWRUtil.addOptions(selectid, data, prop) 用text和value的集合来为每一个数组元素创建一个选项,pro参数指定text和value的值。
      Array of objects (with differing option text and value): DWRUtil.addOptions(selectid, array, valueprop, textprop) 用text和value的集合来为每一个数组元素创建一个选项,valueprop确定value,textprop确定text。
      Object: DWRUtil.addOptions(selectid, map, reverse) 为map中每一个属性(property)创建一个选项,属性名作为选项的value,属性的value作为选项的text。这样做看起来是错的,但实际上这种做法的确是正确的。如果reverse参数被设置为true,则属性的value还是被用做选项的value。
      Map of objects: DWRUtil.addOptions(selectid, map, valueprop, textprop) 为map中的每一个对象创建一个选项,valueprop指定选项的value,textprop指定选项的text。
      Generating Tables
      DWRUtil.addRows() 从一个数组(第二个参数)取得值,创建table的每一行。从另一个数组(第三个参数)去得值,为table的每一行创建若干列。
      DWRUtil.getText(id)
      可以根据id取得text的值,这个方法只能用于select list
      DWRUtil.getValue(id)
      可以根据id取得value,使用这个方法,你不必在意div和select list的不同。
      DWRUtil.getValues()
      getValues() is similar to getValue() except that the input is a Javascript object that contains name/value pairs. The names are assumed to be the IDs of HTML elements, and the values are altered to reflect the contents of those IDs. This method does not return the object in question, it alters the value that you pass to it.
      这个方法和getValue()一样,只是它传入的是一个包含名字和数值的j avascript对象.这个名字就是HTML元素的ID。这个方法不会返回任何对象,它只会将ID的value映射给传入的value。例:
      function doGetValues() {
       var text= "{
       div:null,
       textarea:null,
       select:null,
       text:null,
       password:null,
       formbutton:null,
       button:null
      }";
       var object = objectEval(text);    //j avascript对象
       DWRUtil.getValues(object);
       var reply = DWRUtil.toDescriptiveString(object, 2);   //toString
       reply = reply.replace(/n/g, "<br/>");                        //转意
       DWRUtil.setValue("getvaluesret", reply);                     //显示
      }
      DWRUtil.onReturn
      贴一段代码,暂时不理解,用onReturn和不用有什么区别
      <script>
      function submitFunction()
      {
         $("alert").style.display = "inline";
         setTimeout("unsubmitFunction();", 1000);
      }
      function unsubmitFunction()
      {
         $("alert").style.display = "none";
      }
      </script>
      <p><input type="text" onkeydown="DWRUtil.onReturn(event, submitFunction)"/>
      <input type="button" onclick="submitFunction()" value="GO"/>
      <span id="alert" style="display:none; background:#FFFFDD; font-weight:bold;">submitFunction called</span>
      </p>
      DWRUtil.selectRange
      在一个input box里选一个范围
      DWRUtil.selectRange("sel-test", $("start").value, $("end").value);
      DWRUtil.setValue(id, value)
      用ID找到元素,并更新value
      DWRUtil.setValues()
      和setValue(id,value)一样,只是它需要的参数是个j avascript对象,如:
      DWRUtil.setValues({
       div: "new div content",
       password: "1234567890"
      });
      DWRUtil.toDescriptiveString
      带debug信息的toString,第一个为将要debug的对象,第二个参数为处理等级。等级如下:
      0: Single line of debug 单行调试
      1: Multi-line debug that does not dig into child objects 不分析子元素的多行调试
      2: Multi-line debug that digs into the 2nd layer of child objects 最多分析到第二层子元素的多行调试
      And so on. Level 2 and greater probably produce too much output.
      总结:DWR不但屏蔽了许多client与server交互的重复且复杂的代码,而且还提供了一些常用的方法,一些思想还是从prototype继承而来,并有一定的改进。同时,它也考虑到了与struts、hibernate、spring的结合问题。
      需要注意的是,DWR是一种把服务器端的java代码通过j avascript直接从浏览器调用的方法(DWR is a way of calling Java code on the server directly from Javascript in the browser.),而不是一个j avascript的库(Generally speaking DWR is not a generic JavaScript library so it does not attempt to provide fill this need. However this is one of these really useful functions to have around if you are doing Ajax work.)能做到怎么多,已经很难得了。

分享到:
评论

相关推荐

    DWR以及DWR中文说明,DWR实例

    DWR以及中文说明,还有相关配置及实例.

    dwr ajax完整示例,内有dwr配置说明文档,eclicps工程

    在本示例中,我们有一个关于DWR的完整案例,包括配置说明文档和一个Eclipse工程,这对于初学者或者想要深入理解DWR的人来说非常有用。 首先,DWR的核心功能在于它的反向AJAX技术。传统的AJAX请求是单向的,即从...

    dwr ajax完整示例,内有dwr配置说明文档,sql脚本

    标题中的“dwr ajax完整示例”指的是Direct Web Remoting (DWR) 技术与AJAX(Asynchronous JavaScript and XML)的结合应用。DWR是一种开源Java库,它允许Web应用程序在浏览器和服务器之间安全地进行双向通信,使得...

    DWR.xml配置文件说明

    2. **`&lt;dwr&gt;`根元素**:包含了所有DWR相关的配置项。 3. **`&lt;init&gt;`元素**:用于定义初始化参数,如创建者和转换器。每个`&lt;init&gt;`元素内部可以包含多个`&lt;creator&gt;`和`&lt;converter&gt;`子元素,分别用来注册创建者和...

    dwr相关用法以及说明

    DWR (Direct Web Remoting) 是一种开源JavaScript库,它允许Web应用程序在客户端与服务器之间进行实时通信,而无需刷新整个页面。这个技术在2004年首次发布,主要用于提高用户体验,通过Ajax技术实现前后端数据的...

    第一个DWR HelloWorld例子(附:详细说明)

    在开始DWR HelloWorld例子之前,我们需要在项目中引入DWR相关的jar文件,并在web.xml中配置DWR的Servlet。这通常包括设置DWR Context Path、允许访问的类等参数。 3. **创建HelloWorld Java类** 首先,我们需要在...

    DWR所需js文件及jar包以及配置说明

    - `dwr.xml`: 这是DWR的配置文件,用于定义哪些Java类和方法可以被远程调用,以及相关的安全设置。例如,你可以在这里指定允许跨域访问的IP或域名,以及启用或禁用CSP(内容安全策略)。 4. **DWR配置说明**: - ...

    dwr入门+springmvc实现

    DWR(Direct Web Remoting)是一个WEB远程调用框架.利用这个框架可以让AJAX开发变得很简单.利用DWR可以在客户端利用JavaScript直接调用服务端的Java方法并...本次例子只是用于演示,说明DWR的使用,类设计并不是最优的

    DWR.xml配置文件说明书(含源码)

    DWR.xml配置文件说明书 1、 建立dwr.xml 配置文件 任何一个dwr.xml的文件都需要包含DWR DOCTYPE的声明行,格式如下: &lt;!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 1.0//EN" ...

    dwr 包的 使用入门

    以下是对DWR包的使用入门的详细说明: 1. **DWR的安装与配置**: - 在Java项目中引入DWR库,通常通过Maven或Gradle添加依赖。 - 配置DWR的`dwr.xml`文件,定义允许的远程方法和类,这是DWR的核心配置文件,用于...

    SSH+DWR整合,有图片,有实例,有说明,非常详细

    4. **配置Spring:** 如果你的项目已经使用了Spring框架,你需要将DWR的配置整合到Spring的配置文件中,例如通过`&lt;bean&gt;`标签创建DWR的相关bean。 5. **生成JavaScript接口:** DWR会自动生成JavaScript库,使得...

    dwr实例,dwr例子,能直接运行,很实用

    2. **引擎(Engine)**:负责处理所有与DWR相关的请求和响应,包括安全性和转换数据。 3. **反向Ajax(Reverse Ajax)**:DWR的核心特性,使服务器能够主动调用客户端的JavaScript函数,而不仅仅是响应客户端的请求...

    DWR示例与spring集成

    1. **配置Spring**:在Spring的配置文件中,我们需要定义DWR的相关bean,如`DWRConfigurer`和`DWRController`。 2. **利用Spring管理DWR的bean**:DWR中的Java对象可以通过Spring的依赖注入来管理,这样可以方便地...

    dwr相关文档jar包

    标题中的“dwr相关文档jar包”指的是与DWR相关的软件包,其中包括核心库、API文档以及帮助文档。这些组件对于理解和使用DWR至关重要。 1. **dwr.jar**: 这是DWR的核心库文件,包含了所有运行DWR所需的类和资源。将...

    dwr-1.1.3-src.zip

    7. `LICENSE.txt` 包含了DWR的许可协议,详细说明了软件的使用条件和版权信息。 8. `dwr.war` 是Web应用程序的归档文件,遵循Java EE的WAR标准,包含了DWR的Web应用部署所需的所有文件,比如HTML、CSS、JavaScript...

    DWR的技术分析与界面开发

    在这个压缩包中,包含了一系列关于DWR技术分析、学习资料以及相关的界面开发内容,对于理解和掌握DWR技术至关重要。 首先,DWR的XML配置文件是连接客户端与服务器端的关键,它定义了哪些Java对象和方法可以被...

    dwr2.0.10.jar

    描述中的“dwr2.0.10.zip 包括jar文件和war运行文件”说明了这个压缩包不仅包含JAR文件,还包含了一个Web Application Archive (WAR) 文件,即“dwr2.0.10.war”。WAR文件是一种特殊格式的归档文件,用于部署在Java...

    DWR简单配置说明---xml、java、jsp层层说明

    这一步是为了告诉Web容器如何处理与DWR相关的请求。 ```xml &lt;servlet-name&gt;dwr-invoker &lt;servlet-class&gt;org.directwebremoting.servlet.DwrServlet &lt;servlet-name&gt;dwr-invoker &lt;url-pattern&gt;/dwr/* ``` ...

Global site tag (gtag.js) - Google Analytics