ajax级联基础代码,转载于
http://joe5456536.blog.163.com/blog/static/85374773201292172611889/
这里贴出经过测试运行后的代码,以及jar包
用到的jar包:
commons-beanutils-1.8.3.jar
commons-collections-3.2.1.jar
commons-lang-2.6.jar
commons-logging-1.1.1.jar
ezmorph-1.0.6.jar
json-lib-2.4-jdk15.jar
一共六个,开发的IDE是Myeclipse 8.5 tomcat 6.5
jsp页面
class="html" name="code">
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ page import="com.jquery.ajax.test.*" %>
<%
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 TEST</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">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript"
src="${pageContext.request.contextPath}/js/jquery-1.4.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
alert("aaa");
$("#privince").change(function(){
alert("bbb");
$.ajax({type:"POST",
url:"sssss",
dataType:"json",
data:{"privinceId" : $("#privince
option:selected").val()},
success:function(data){
$("#city").html("");
$.each(data,function(i,item){
$("#city").append("<option value="+item.id
+">"+item.name+"</option>");
});
}
});
});
});
</script>
</head>
<body>
<%
Map<String , Privince> privincesMap = TestDB.getPrivinces();
List<Privince> privinces = new ArrayList<Privince>();
for(String privinceId : privincesMap.keySet()){
privinces.add(privincesMap.get(privinceId));
}
pageContext.setAttribute("privinces" , privinces);
%>
<table>
<tr>
<td>省会:
<select id="privince" name="privince" >
<c:forEach items="${privinces}" var="privince">
<option value="${privince.id}">
${privince.name}</option>
</c:forEach>
</select>
</td>
<td>城市:<select id="city" name="city" ></select></td>
</tr>
</table>
</body>
</html>
City
package com.jquery.ajax.test;
public class City {
private final String id;
private final String name;
public City(String id , String name){
this.id = id;
this.name = name;
}
public String getId() {
return id;
}
public String getName() {
return name;
}
}
Privince
package com.jquery.ajax.test;
import java.util.ArrayList;
import java.util.List;
public class Privince {
private final String id;
private final String name;
private List<City> cities = new ArrayList<City>();
public Privince(String id , String name){
this.id = id;
this.name = name;
}
public void addCity(City city){
this.cities.add(city);
}
public String getId() {
return id;
}
public String getName() {
return name;
}
public List<City> getCities() {
return cities;
}
}
TestDB
package com.jquery.ajax.test;
import java.util.Map;
import java.util.TreeMap;
public class TestDB {
private static Map<String , Privince> privinces = new TreeMap<String , Privince>
();
static {
Privince beiJing = new Privince("001" , "北京");
privinces.put("001", beiJing);
Privince shangHai = new Privince("002", "上海");
privinces.put("002", shangHai);
Privince tianJing = new Privince("003", "天津");
privinces.put("003", tianJing);
Privince chongQing = new Privince("004", "重庆");
privinces.put("004", chongQing);
// 河北
Privince heBei = new Privince("005", "河北");
City hbsjz = new City("005001", "石家庄");
heBei.addCity(hbsjz);
City hbqhd = new City("005002", "秦皇岛");
heBei.addCity(hbqhd);
City hbbd = new City("005003", "保定");
heBei.addCity(hbbd);
City hbts = new City("005004", "唐山");
heBei.addCity(hbts);
City hblf = new City("005005", "廊坊");
heBei.addCity(hblf);
City hbcd = new City("005006", "承德");
heBei.addCity(hbcd);
City hbcz = new City("005007", "沧州");
heBei.addCity(hbcz);
City hbzjk = new City("005008", "张家口");
heBei.addCity(hbzjk);
City hbhd = new City("005009", "邯郸");
heBei.addCity(hbhd);
City hbxt = new City("005010", "邢台");
heBei.addCity(hbxt);
City hbhs = new City("005011", "衡水");
heBei.addCity(hbhs);
privinces.put("005", heBei);
// 河南
Privince heNan = new Privince("006", "河南");
City hnzz = new City("006001", "郑州");
heNan.addCity(hnzz);
City hnly = new City("006002", "洛阳");
heNan.addCity(hnly);
City hnny = new City("006003", "南阳");
heNan.addCity(hnny);
City hnxc = new City("006004", "许昌");
heNan.addCity(hnxc);
City hnpds = new City("006005", "平顶山");
heNan.addCity(hnpds);
City hzk = new City("006006", "周口");
heNan.addCity(hzk);
City hay = new City("006007", "安阳");
heNan.addCity(hay);
City hnjz = new City("006008", "焦作");
heNan.addCity(hnjz);
City hnxx = new City("006009", "新乡");
heNan.addCity(hnxx);
City hbsq = new City("006010", "商丘");
heNan.addCity(hbsq);
City hbxy = new City("006011", "信阳");
heNan.addCity(hbxy);
City hnzmd = new City("006012", "驻马店");
heNan.addCity(hnzmd);
City hnkf = new City("006013", "开封");
heNan.addCity(hnkf);
City hnsmx = new City("006014", "三门峡");
heNan.addCity(hnsmx);
City hnpy = new City("006015", "濮阳");
heNan.addCity(hnpy);
privinces.put("006", heNan);
// 山西
Privince shanXi = new Privince("007", "山西");
City sxty = new City("007001", "太原");
shanXi.addCity(sxty);
City sxdt = new City("007002", "大同");
shanXi.addCity(sxdt);
City sxcz = new City("007003", "长治");
shanXi.addCity(sxcz);
City sxyq = new City("007004", "阳泉");
shanXi.addCity(sxyq);
City sxjz = new City("007005", "晋中");
shanXi.addCity(sxjz);
City sxjc = new City("007006", "晋城");
shanXi.addCity(sxjc);
City sxlf = new City("007007", "临汾");
shanXi.addCity(sxlf);
City sxyc = new City("007008", "运城");
shanXi.addCity(sxyc);
City sxln = new City("007009", "吕梁");
shanXi.addCity(sxln);
City sxxz = new City("007010", "忻州");
shanXi.addCity(sxxz);
City sxsz = new City("007011", "朔州");
shanXi.addCity(sxsz);
privinces.put("007", shanXi);
// 辽宁
Privince liaoNing = new Privince("008", "辽宁");
City lnsy = new City("008001", "沈阳");
liaoNing.addCity(lnsy);
City lndl = new City("008002", "大连");
liaoNing.addCity(lndl);
City lnas = new City("008003", "鞍山");
liaoNing.addCity(lnas);
City lnyk = new City("008004", "营口");
liaoNing.addCity(lnyk);
City lnpj = new City("008005", "盘锦");
liaoNing.addCity(lnpj);
City lnfs = new City("008006", "抚顺");
liaoNing.addCity(lnfs);
City lnjz = new City("008007", "锦州");
liaoNing.addCity(lnjz);
City lnbx = new City("008008", "本溪");
liaoNing.addCity(lnbx);
City lndd = new City("008009", "丹东");
liaoNing.addCity(lndd);
City lntn = new City("008010", "铁岭");
liaoNing.addCity(lntn);
City lnly = new City("008011", "辽阳");
liaoNing.addCity(lnly);
privinces.put("008", liaoNing);
// 吉林
Privince jiLin = new Privince("009", "吉林");
City jljl = new City("009001", "吉林");
jiLin.addCity(jljl);
City jlcc = new City("009002", "长春");
jiLin.addCity(jlcc);
City jlbs = new City("009003", "白山");
jiLin.addCity(jlbs);
City jlsy = new City("009004", "松原");
jiLin.addCity(jlsy);
City jlsp = new City("009005", "四平");
jiLin.addCity(jlsp);
City jlyb = new City("009006", "延边");
jiLin.addCity(jlyb);
City jlth = new City("009007", "通化");
jiLin.addCity(jlth);
City jlbc = new City("009008", "白城");
jiLin.addCity(jlbc);
City jnly = new City("009009", "辽源");
jiLin.addCity(jnly);
privinces.put("009", jiLin);
// 黑龙江
Privince heiLongJiang = new Privince("010", "黑龙江");
City hljhrb = new City("010001", "哈尔滨");
heiLongJiang.addCity(hljhrb);
City hljdq = new City("010002", "大庆");
heiLongJiang.addCity(hljdq);
City hljqqhr = new City("010003", "齐齐哈尔");
heiLongJiang.addCity(hljqqhr);
City hljmdj = new City("010004", "牡丹江");
heiLongJiang.addCity(hljmdj);
City hljjms = new City("010005", "佳木斯");
heiLongJiang.addCity(hljjms);
City hljsh = new City("010006", "绥化");
heiLongJiang.addCity(hljsh);
City hljhh = new City("010007", "黑河");
heiLongJiang.addCity(hljhh);
City hljjx = new City("010008", "鸡西");
heiLongJiang.addCity(hljjx);
City hljsys = new City("010009", "双鸭山");
heiLongJiang.addCity(hljsys);
City hljyc = new City("010010", "伊春");
heiLongJiang.addCity(hljyc);
privinces.put("010", heiLongJiang);
Privince jiangSu = new Privince("011", "江苏");
privinces.put("011", jiangSu);
Privince zheJiang = new Privince("012", "浙江");
privinces.put("012", zheJiang);
Privince anHui = new Privince("013", "安徽");
privinces.put("013", anHui);
Privince fuJian = new Privince("014", "福建");
privinces.put("014", fuJian);
Privince jiangXi = new Privince("015", "江西");
privinces.put("015", jiangXi);
Privince shanDong = new Privince("016", "山东");
privinces.put("016", shanDong);
Privince huBei = new Privince("017", "湖北");
privinces.put("017", huBei);
Privince huNan = new Privince("018", "湖南");
privinces.put("018", huNan);
Privince guangDong = new Privince("019", "广东");
privinces.put("019", guangDong);
Privince haiNan = new Privince("020", "海南");
privinces.put("020", haiNan);
// 四川
Privince siChuan = new Privince("021", "四川");
City sccd = new City("021001", "成都");
siChuan.addCity(sccd);
City scnc = new City("021002", "南充");
siChuan.addCity(scnc);
City scmy = new City("021003", "绵阳");
siChuan.addCity(scmy);
City scdz = new City("021004", "达州");
siChuan.addCity(scdz);
City scyb = new City("021005", "宜宾");
siChuan.addCity(scyb);
City scls = new City("021006", "乐山");
siChuan.addCity(scls);
City scdy = new City("021007", "德阳");
siChuan.addCity(scdy);
City scnj = new City("021008", "内江");
siChuan.addCity(scnj);
City sczg = new City("021009", "自贡");
siChuan.addCity(sczg);
City sclz = new City("021010", "泸州");
siChuan.addCity(sclz);
City scyn = new City("021011", "遂宁");
siChuan.addCity(scyn);
City sczy = new City("021012", "资阳");
siChuan.addCity(sczy);
City scgy = new City("021013", "广元");
siChuan.addCity(scgy);
City scpzh = new City("021014", "攀枝花");
siChuan.addCity(scpzh);
City scga = new City("021015", "广安");
siChuan.addCity(scga);
City scbz = new City("021016", "巴中");
siChuan.addCity(scbz);
City scms = new City("021017", "眉山");
siChuan.addCity(scms);
City scya = new City("021018", "雅安");
siChuan.addCity(scya);
privinces.put("021", siChuan);
}
private TestDB(){}
public static Map<String, Privince> getPrivinces() {
return privinces;
}
}
Servlet
package com.jquery.ajax.test;
import java.io.IOException;
import java.util.List;
import java.util.Map;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONArray;
public class SelectServlet extends HttpServlet {
Map<String , Privince> privincesMap = TestDB.getPrivinces();
public void doPost(HttpServletRequest request , HttpServletResponse response){
response.setContentType("text/html;charset=utf-8");
String privinceId = request.getParameter("privinceId");
Privince privince = privincesMap.get(privinceId);
List<City> cities = privince.getCities();
try {
response.getWriter().write(JSONArray.fromObject(cities).toString
());
} catch (IOException e) {
e.printStackTrace();
}
}
public void doGet(HttpServletRequest request , HttpServletResponse response){
this.doPost(request, response);
}
}
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>
<servlet>
<servlet-name>jquerys</servlet-name>
<servlet-class>com.jquery.ajax.test.SelectServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>jquerys</servlet-name>
<url-pattern>/sssss</url-pattern>
</servlet-mapping>
</web-app>