DWR实现省市县三级联动 - DWR - AJAX

Java代码 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. <servlet> <servlet-name>dwr-invoker</servlet-name> <servlet-class>uk.ltd.getahead.dwr.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>
http://www.javaeye.com/post/354281?page=1(第 2/9 页)[2008/3/7 17:12:43]
DWR实现省市县三级联动 - DWR - AJAX - JavaEye论坛
7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. 22. 23. 24. 25. 26. 27. 28. 29. 30. 31. 32. 33. 34. 35. 36. 37. 38. 39. 40. 41.
import java.util.HashMap; import java.util.Map; import com.xinli.struts.db.DBManager; /** * @author fuhao */ public class ProvinceDAO { private static Connection conn = null; private static Statement stmt = null; private static ResultSet rs = null; // 全取所有的parentid=0的记录,也即将所有的省查询出来,放入Map中 public Map getFirst() throws SQLException { Map map = new HashMap(); String sql = "select * from province where parentid = " + 0; try { conn = DBManager.getConnection(); stmt = conn.createStatement(); rs = stmt.executeQuery(sql); while (rs.next()) { map.put(rs.getInt("id"), rs.getString("name")); } return map; } catch (Exception e) { System.out.println("----获得省的方法出现异常:" + e); e.printStackTrace(); return null; } finally { if (rs != null && stmt != null && conn != null) { rs.close();
然后在web.xml的同目录下,创建一个dwr.xml,配置如下:
http://www.javaeye.com/post/354281?page=1(第 1/9 页)[2008/3/7 17:12:43]
DWR实现省市县三级联动 - DWR - AJAX - JavaEye论坛
Java代码 1. 2. 3. 4. 5. 6. 7. 8. 9. <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 0.4//EN" "http://www.getahead.ltd.uk/ dwr/dwr.dtd"> <dwr> <allow> <create creator="new" javascript="province"> <param name="class" value="com.xinli.struts.service.ProvinceService"/> </create> </allow> </dwr>
DWR实现省市县三级联动 - DWR - AJAX - JavaEye论坛
点击页面超链接,进入如下页面:
点击getChild("1")后面的Execute方法,如果弹出如下所示的弹出框:
则说明DWR配置完全正确,可以继续写jsp页面了!曙光就在眼前!呵呵~~~ 前台的jsp页面index.jsp代码如下:
DWR实现省市县三级联动 - DWR - AJAX - JavaEye论坛
前段时间想学习学习DWR,在网上查找资料无数,没有见到一个现成的例子可以参阅一下,郁闷无比,罢了,还是 自己动手,丰衣足食吧! 本例子是由MySQL数据库,结合前台使用Struts来完成的.主要是为了说明DWR的使用,所以对于数据库的设计等 等都较简单,大家觉得那里有什么不合理之处请给我留言!数据库创建的脚本在附件里面. 数据库的大概设计是,共有三个字段[id,name,parentid],顾名思义,id就是唯一标示一条记录,name存放的是省 市县的名称,parentid存放的其上级的id,例如对于省一级别的,其parentid全部为0,对于市一级别的,其parentid 存放的是所对应省的id,对于县一级别的,其parentid存放的是所对应市的id. 首先在进入显示页面的时候就把所有的parentid=0的全部查出来,初始化进入省所在的下拉列表中,然后根据选择 省的下拉列表,通过DWR调用java方法将其所对应的市取出来,以此类推…… 这里主要需要说明的是在web.xml里面需要配置如下:
OK,至此我们需要测试一下,看看配置的DWR是否正确,启动Tomcat,通过访问http://localhost:8080/ Struts_Dwr/dwr,此时会出现如下图所示的页面:
http://www.javaeye.com/post/354281?page=1(第 4/9 页)[2008/3/7 17:12:43]
http://www.javaeye.com/post/354281?page=1(第 3/9 页)[2008/3/7 17:12:43]
DWR实现省市县三级联动 - DWR - AJAX - JavaEye论坛
42. 43. 44. 45. 46. 47. 48. 49. 50. 51. 52. 53. 54. 55. 56. 57. 58. 59. 60. 61. 62. 63. 64. 65. 66. 67. 68. 69. 70. 71. } } } } } } } }
stmt.close(); conn.close();
// 根据parentid获得其下所对应的记录 public Map getChildByParentId(String id) throws SQLException { Map map = new HashMap(); String sql = "select * from province as p where p.parentid =" + id; try { conn = DBManager.getConnection(); stmt = conn.createStatement(); rs = stmt.executeQuery(sql); while (rs.next()) { map.put(rs.getInt("id"), rs.getString("name")); return map; } catch (Exception e) { System.out.println("----根据父id获得子记录的方法出现异常:" + e); e.printStackTrace(); return null; } finally { if (rs != null && stmt != null && conn != null) { rs.close(); stmt.close(); conn.close();
http://www.javaeye.com/post/354281?page=1(第 5/9 页)[2008/3/7 17:12:43]
DWR实现省市县三级联动 - DWR - AJAX - JavaEye论坛
Java代码 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. 22. 23. 24. 25. 26. 27. 28. 29. 30. 31. 32. 33. } } // 回调函数 function cityReturn(data){ var obj_City = document.getElementById("sel_City"); DWRUtil.removeAllOptions(obj_City); DWRUtil.addOptions(obj_City,{'':'请选择'}); DWRUtil.addOptions(obj_City,data); } <%@ page language="java" pageEncoding="GB2312"%> <%@ taglib uri="/WEB-INF/c.tld" prefix="c"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>省市县三级联动</title> <script type="text/javascript" src="dwr/interface/province.js"></script> <script type="text/javascript" src="dwr/engine.js"></script> <script type="text/javascript" src="dwr/util.js"></script> <script language="javascript"> // 根据选择的省,获得其所辖的市 function getCity(){ var obj_Pro = document.getElementById("sel_Pro"); vቤተ መጻሕፍቲ ባይዱr obj_City = document.getElementById("sel_City"); var obj_County = document.getElementById("sel_County"); var pro_Index = obj_Pro.selectedIndex; var pro_Value = obj_Pro.options[pro_Index].value; if(pro_Value != "" && pro_Value != null){ province.getChild(pro_Value,cityReturn); }else{ DWRUtil.removeAllOptions(obj_City); DWRUtil.addOptions(obj_City,{'':'请选择'}); DWRUtil.removeAllOptions(obj_County); DWRUtil.addOptions(obj_County,{'':'请选择'});
对于dwr.xml需要说明的是: 1.creator:定义供javascript调用的新建对象的方法,也即对象的构造方法.其可以包括【new,none, scripted,spring,jsf,struts,pageflow,ejb3】关于creator的具体用法,可以参照http://getahead.org/dwr/ server/dwrxml/creators. 2.javascript:java类暴露给浏览器所调用的javascript的名称,也就是在jsp页面所出现的js的名称一定和此处所定义 的一致. 3.param:指定create元素所需要的参数,比如其允许创建的java类的名称. 4.name:param元素所指定的参数名称. 5.value:param元素所指定的参数值. 后台业务方法实现如下ProvinceDAO:
Java代码 1. 2. 3. 4. 5. 6. import java.sql.Connection; import java.sql.ResultSet; import java.sql.SQLException; import java.sql.Statement; package com.xinli.struts.dao;