DWR实现二级联动下拉框

JSP代码如下：

1. <select id="pro" onchange="selectPro();">
2.     <option>
3.         --请选择省份--
4.     </option>
5.     <option value="江西省">
6.         江西省
7.     </option>
8.     <option value="JiangSu">
9.         江苏省
10.     </option>
11.     <option value="ZheJiang">
12.         浙江省
13.     </option>
14. </select>
15. <select id="city">
16.     <option>
17.         --请选择城市--
18.     </option>
19. </select>

JavaScript代码如下：

1. <script type='text/javascript' src='/DWRDemo/dwr/interface/cityList.js''></script>
2. <script type='text/javascript' src='/DWRDemo/dwr/engine.js'></script>
3. <script type='text/javascript' src='/DWRDemo/dwr/util.js'></script>
4. <script type='text/javascript'>
5.     function selectPro(){
6.         var pro=DWRUtil.getValue("pro");            
7.         cityList.getCity(pro,updateCity);               
8.     }
9.     function updateCity(citys){ 
10.         citys.unshift("--请选择城市--");
11.         DWRUtil.removeAllOptions("city");   
12.         DWRUtil.addOptions("city",citys);
13.     }
14. </script>

Java代码如下：

1. public class CityList {
2.     static Map cityMap;
3.     static {
4.         cityMap = new HashMap();
5.         String[] city = new String[]{"南昌","九江","吉安"};
6.         cityMap.put("江西省", city);
7.         city = new String[]{"南京","苏州","镇江"};
8.         cityMap.put("JiangSu", city);
9.         city = new String[]{"杭州","温州"};
10.         cityMap.put("ZheJiang", city);
11.     }
12.     public String[] getCity(String pro){
13.         return (String[])cityMap.get(pro);
14.     }
15. }

dwr.xml代码如下：

1. <?xml version="1.0" encoding="UTF-8"?>
2. <!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr/dwr20.dtd">
4. <dwr>
5.     <allow>
6.         <create creator="new" javascript="helloDemo">
7.             <param name="class"
8.                 value="org.getahead.dwrdemo.simpletext.Hello" />
9.             <include method="sayHello" />
10.             <include method="sayHello2" />
11.         </create>
12.         <create creator="new" javascript="people">
13.             <param name="class" value="com.People" />
14.         </create>
15.         <create creator="new" javascript="cityList">
16.             <param name="class" value="com.CityList" />
17.         </create>
18.     </allow>
19. </dwr>

web.xml代码如下：

1. <?xml version="1.0" encoding="UTF-8"?>
2. <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
3.     xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
4.     xsi:schemaLocation="http://java.sun.com/xml/ns/javaee  
5.     http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> 
6.     <servlet>
7.         <servlet-name>dwr-invoker</servlet-name>
8.         <display-name>DWR Servlet</display-name>
9.         <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
10.         <init-param>
11.             <param-name>debug</param-name>
12.             <param-value>true</param-value>
13.         </init-param>
14.     </servlet>
16.     <servlet-mapping>
17.         <servlet-name>dwr-invoker</servlet-name>
18.         <url-pattern>/dwr/*</url-pattern>
19.     </servlet-mapping>
20.     
21.     <welcome-file-list>
22.         <welcome-file>index.jsp</welcome-file>
23.     </welcome-file-list>
24. </web-app>