一天时间换来的DWR学习经验

   今天在做web财务系统时，遇到的一个问题：在我的一个jsp页面中有一个select和一个文本框，select里的值是从数据库取的，现在我怎么才能选择一下select，取得select的value值，然后不刷新页面，从数据库查找相应的的数据后显示在文本框中呢?如图：

 

 在qq群上问了几个高手，说是要用ajax之类的，还有一个比较简洁的ajax就是dwr。为了实现这个问题，用了一天的时间，终于解决了这样问题。其实也就是怎样在JavaScript中调用Java的问题。

 

1.先来看看dwr的在项目中的配置

 

   dwr.jar包的下载地址：

    （1）把dwr.jar添加到项目中;

    （2）web.xml中添加如下内容：

Java代码

      dwr-invoker
      class>uk.ltd.getahead.dwr.DWRServletclass>

         debug
          true



        dwr-invoker
        /dwr/*

然后在web.xml的同目录下，创建一个dwr.xml，配置如下：

Java代码

"1.0" encoding="UTF-8"?>
dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 0.4//EN" "dwr/dwr.dtd">
<dwr>

    "new" javascript="province">
      "class" value="com.sdau.hibernate.dao.commodity.CommodityDAO"/>


dwr>

对于dwr.xml需要说明的是：
1.creator：定义供javascript调用的新建对象的方法，也即对象的构造方法。其可以包括【new，none，scripted，spring，jsf，struts，pageflow，ejb3】关于creator的具体用法，可以参照。
2.javascript：java类暴露给浏览器所调用的javascript的名称，也就是在jsp页面所出现的js的名称一定和此处所定义的一致。
3.param：指定create元素所需要的参数，比如其允许创建的java类的名称。
4.name：param元素所指定的参数名称。
5.value：param元素所指定的参数值。其中CommodityDAO是一我的一个commodity实体的操作类

前台的jsp页面index.jsp代码如下

 

  
    
       
      
    
 
 
   

   onchange="showmoney();" tabindex="0">
         请选择信息类别

         ....... 显示下拉列表代码........

  

     
     

      
     
     
       

 

    对于index.jsp需要说明的是：需要引用三个js，province.js[其与dwr.xml里面的javascript的名称相同]，engine.js，util.js。其中对于province.js是由dwr自动生成的javascript文件，包括相应的类以及方法。dwr/engine.js是dwr的核心引擎脚本处理客户端调用的转换，dwr/util.js包含了工具函数简化页面处理。

2.核心代码说明

   其中最重要的是JavaScript代码的编写，为了获得select中当前选中的值用了var currSelectValue = document.all.info.value; 其中info为select的id号。具体参考我的这篇转载文章http://blog.chinaunix.net/u2/87262/showart.php?id=1923294

  还有就是Ajax框架DWR用法 大体简单的流程如下：

1、下载安装DWR的Jar包，放到WEB应用程序目录中的WEB-INF/lib目录中。本次使用的是2.0，最新的已经有3.0RC版本了。由于从2.0版本开始该DWR框架依赖于一个开源的组件，所以可能还需要下载它（如果到第三步时报找不到类的错误的话），同样的，将jar文件放到上面的lib目录中。

2、编辑WEB应用程序目录中的WEB-INF/web.xml文件，增加对DWR的servlet配置，如下：

   本文相关代码如下：

 dwr-invoker
 DWR Servlet
 org.directwebremoting.servlet.DwrServlet
 
    debug
    true
 



 dwr-invoker
 /dwr/*

3、创建一个dwr.xml文件，放到同步骤2的web.xml文件同一位置，配置要公布出来供ajax使用的java类，如下

   "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN"
   "">


 
   
      value="java.util.Date"/>
   
   
      value="your.java.Bean"/>
   
 

其中的蓝色部分指定要公布出来的可供客户端调用的类，比如这个JAVA内置类java.util.Date也是可以的。而红色部分javascript="Demo"则是为该类指定一个在JS端使用的对象名（或者叫它别名吧），名称是你自己定的，根据个人喜好。js就是通过该别名来调用其方法的。此名称在后面还会用到（红色标注）

4、用浏览器访问[YOUR-WEBAPP]/dwr/ 即可看到配置的公布出来的供AJAX调用的类。其中的[YOUR-WEBAPP]是本次用来测试的WEB应用程序名。

5、创建一个WEB页（jsp或HTML），页头引入两行代码：

其中的Demo就是要调用的JAVA类的别名(dwr.xml中配置的别名）。此处js文件的路径是从根目录开始的路径，根据需要也可以用相对路径，如

6、在页面的合适区域调用公布出来的JAVA类的合适方法。假设your.java.Bean类有一个方法是String getRealPath(String path)，那就只要这么两行代码即可：

有不懂的邮箱联系：