DWR(Direct Web Remoting)是一个用于改善web页面与Java类交互的远程服务器端Ajax开源框架,可以帮助开发人员开发包含AJAX技术的网站。它可以允许在浏览器里的代码使用运行在WEB服务器上的JAVA函数,就像它就在浏览器里一样。
使用DWR首先加入DWR的jar包.我这里用的是2.0.5的.
看代码吧,首先是index.jsp
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>ajax三级联动</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <script type="text/javascript" src="dwr/engine.js"></script> <script type="text/javascript" src="dwr/util.js"></script> <!-- 导入DWR 为Java 对象动态生成的JavaScript 文件--> <script type="text/javascript" src="dwr/interface/mydwr.js"></script> <script type="text/javascript" src="jquery-1.8.3.min.js"></script></head> <script type="text/javascript"> $(function(){ mydwr.findProvince(function(pro){ for(var i=0;i<pro.length;i++){ $(".province").append("<option value="+pro[i].id+">"+pro[i].province+"</option>"); } }); }); </script> <body> 省:<select name="province" class="province"> <option value="0">==请选择==</option> </select> 市:<select name="city" class="city"> <option>==请选择==</option> </select> 区:<select name="town" class="town"> <option>==请选择==</option> </select> </body> <script type="text/javascript"> $(".province").change(function(){ if($(".province").val()==0){ $(".city option").remove(); $(".city").append("<option value=0>==请选择==</option>"); $(".town option").remove(); $(".town").append("<option value=0>==请选择==</option>"); return; } mydwr.findCityById($(this).val(),function(city){ $(".city option").remove(); $(".city").append("<option value=0>==请选择==</option>"); for(var i=0;i<city.length;i++){ $(".city").append("<option value="+city[i].id+">"+city[i].city+"</option>"); } }); }); $(".city").change(function(){ if($(".city").val()==0){ $(".town option").remove(); $(".town").append("<option value=0>==请选择==</option>"); return; } mydwr.findTownById($(this).val(),function(town){ $(".town option").remove(); $(".town").append("<option value=0>==请选择==</option>"); for(var i=0;i<town.length;i++){ $(".town").append("<option value="+town[i].id+">"+town[i].town+"</option>"); } }); }); </script> </html>
三个实体类
package cn.yo.entity; import java.util.HashSet; import java.util.Set; public class Province implements java.io.Serializable { private Integer id; private String province; private Set cities = new HashSet(0); //省略了get,set方法 } package cn.yo.entity; import java.util.HashSet; import java.util.Set; public class City implements java.io.Serializable { private Integer id; private Province province; private String city; private Set towns = new HashSet(0); //省略了get,set方法 } package cn.yo.entity; public class Town implements java.io.Serializable { private Integer id; private City city; private String town; //省略了get,set方法 }
dao类
package cn.yo.dao; import java.util.List; import org.hibernate.Session; import cn.yo.entity.City; import cn.yo.entity.Province; import cn.yo.entity.Town; public class ProvinceDao { //查询全部省 public List<Province> findProvince(){ Session session=HibernateSessionFactory.getSession(); String hql="from Province"; List<Province> province=session.createQuery(hql).list(); if(province.size()>0){ return province; } else{ return null; } } //根据省的Id查询该省下的全部市 public List<City> findCityById(int id){ Session session=HibernateSessionFactory.getSession(); String hql="from City c where c.province.id='"+id+"'"; List<City> city=session.createQuery(hql).list(); if(city.size()>0){ return city; }else{ return null; } } //根据市的Id查询该市下的全部镇 public List<Town> findTownById(int id){ Session session=HibernateSessionFactory.getSession(); String hql="from Town t where t.city='"+id+"'"; List<Town> town=session.createQuery(hql).list(); if(town.size()>0){ return town; }else{ return null; } } }
web.xml
<?xml version="1.0" encoding="UTF-8"?> <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> <!-- DWR --> <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> <init-param> <param-name>crossDomainSessionSecurity</param-name> <param-value>false</param-value> </init-param> <init-param> <param-name>allowScriptTagRemoting</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> </web-app>
dwr.xml:没有他就没有DWR哦,放在web.xml同一目录下
1 <?xml version="1.0" encoding="UTF-8"?> 2 <!DOCTYPE dwr PUBLIC 3 "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" 4 "http://getahead.org/dwr/dwr20.dtd"> 5 6 <dwr> 7 <allow> 8 <create javascript="mydwr" creator="new"> 9 <param name="class" value="cn.yo.dao.ProvinceDao"/> 10 </create> 11 <convert match="cn.yo.entity.Province" converter="bean"/> 12 <convert match="cn.yo.entity.City" converter="bean"/> 13 <convert match="cn.yo.entity.Town" converter="bean"/> 14 </allow> 15 </dwr>
代码全部贴出,希望能给初学者一点帮助.写的不好,希望大家能提出建议.小弟感激不尽
原创作品,转载请注明出处.