项目终于做完了。今天抽点时间对项目中遇到的问题进行下总结,我的模块中在页面要实现一个下拉框联动的功能。例如:你选“中国”时,联动的下拉框显示“北京,上海”;你选美国时,联动的下拉框显示“纽约,华盛顿”。实现这个功能,我采用的是AJAX的一个框架DWR.它是通过动态把java类生成javascript。感觉好像是在客户端调用一样。要使用DWR还需要一些准备工作。1.从网上下载dwr.jar放在项目的lib目录下。注意,还需要commons-logging.jar包,否则会报错说是日志包找不到。3,需要在web.xml中添加

<servlet>
    <servlet-name>dwr-invoker</servlet-name>
    <servlet-class>org.directwebremoting.servlet.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.xml的文件

<?xml version=”1.0″ encoding=”UTF-8″?>
<!DOCTYPE dwr PUBLIC “-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN” “http://getahead.org/dwr//dwr20.dtd”><dwr>
 <allow>
  <create javascript=”test” creator=”new” scope=”request”>
   <param name=”class” value=”com.huan.tv.web.JiLian”></param>
  </create>
 </allow>
</dwr>

具体的参数意思,等我把项目跑起来在说啊,呵呵。到目前为止准备工作已告一段落,现在我就对实现联动功能做具体是代码实现。我写了一个JiLian.java来实现具体功能。

package com.huan.tv.web;

import java.util.TreeMap;
import java.util.Map;

/**
 * 本类是用DWR实现的一个联动类
 * @author guohusong
 *
 */
public  class JiLian {

 static Map countryMap = null;//countryMap封装了获取的国家列表
 static Map cityMap = null;//cityMap封装了获取的国家下的城市列表
 /**
  * 此方法在页面加载时候,把国家数据加载到选择国家的下拉框
  * 在实际开发中这些数据都是从数据库的静态表里读出来的,现在
  * 为了省时间,所以就把数据给写死了。
  * @return map
  */
 public static Map getCountryList(){

  countryMap = new TreeMap();
  countryMap.put(“0”, “–请选择–“);
  countryMap.put(“1”, “中国”);
  countryMap.put(“2”, “美国”);
  return  countryMap;
 }

 /**
  * 此方法是根据选择的国家ID号来联动国家包括的城市列表
  * @param countryKey
  * @return Map
  */
 public static Map getCityList(String countryKey){

  
  cityMap = new TreeMap();
  if(“1”.equals(countryKey.trim())){//如果选择的是中国
   
   cityMap.put(“0”, “–请选择–“);
   cityMap.put(“3”, “北京”);
   cityMap.put(“4”, “上海”);
  }
  if(“2”.equals(countryKey.trim())){//如果选择的是美国
   
   cityMap.put(“0”, “–请选择–“);
   cityMap.put(“5”, “纽约”);
   cityMap.put(“6”, “华盛顿”);
  }else{

   
   cityMap.put(“0”, “–请选择–“);
  }
  return cityMap;
 }
}
 

可以看出JiLian.java就是一个普通的java类。那么DWR框架怎么识别它了?这就需要在dwr.xml中给她指定 <param name=”class” value=”com.huan.tv.web.JiLian”></param>
现在我们就可以对我们写的dwr进行测试了。在地址栏输http://localhost:8080/LianDong/dwr/ (LianDong是我的项目名)你会发现会 出现

Classes known to DWR:

  • test (com.huan.tv.web.JiLian)

test是我在dwr.xml中配置的javascript的值是用来与javascript交互的名称.点击进入你会发现里面有JiLian.java里的getCountryList()和getCityList(String countryKey)方法。现在就可以对联动的方法进行测试了,点击getCountryList()javascript就会把方法里面的值取出来。点击getCityList(“”)在“”里输入1,javascript就会把中国里的城市列出来。输入2,会把美国的城市显示出来。

方法测试通过后,下面就要在页面中调用JiLian.java里的方法。index.jsp

<%@ page language=”java” import=”java.util.*” pageEncoding=”UTF-8″%>
<%@ page import=”com.huan.tv.web.JiLian” %>
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>

<html>
  <head>
  <title>下拉框联动实例</title>

<!–引入DWR的JS–>
  <script type=’text/javascript’ src=’/LianDong/dwr/interface/test.js’></script>
  <script type=’text/javascript’ src=’/LianDong/dwr/engine.js’></script>
  <script type=’text/javascript’ src=’/LianDong/dwr/util.js’></script>
  </head>
   <script type=”text/javascript”>
   function init(){//页面打开时加载国家列表
    test.getCountryList(callback);
   }

//Java从根本上讲是同步机制,然而AJAX却是异步的。所以你调用远程方法时,当数据已经从网络上返回的时候,你要提供有反调 (callback) 功能的DWR
   function callback(data)
   {

   //将从后台获取的国家列表添加到下拉框
    DWRUtil.removeAllOptions(“country”);
    DWRUtil.addOptions(“country”, data);
    changeCity();
   }
   function changeCity()//联动城市下拉框
   {

    test.getCityList(DWRUtil.getValue(“country”),cityback)
 }
 function cityback(data)
 {

  DWRUtil.removeAllOptions(“city”);
     DWRUtil.addOptions(“city”, data);
   
 }
   </script>
  <body οnlοad=”init()”>
   <form name=”form1″ method=”post”>
   <select id=”country” οnchange=”changeCity()”>
 
   </select>
   <select id=”city”>
  
   </select>
   </form>
 
  </body>
</html>