KingZhCool
- 浏览: 30710 次
- 性别:
- 来自: 武汉
-
文章分类
最新评论
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页面
City
Privince
TestDB
Servlet
web.xml
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页面
<%@ 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>
- ajax.7z (1.2 MB)
- 下载次数: 0
分享到：
发表评论
相关推荐
在本案例中，我们关注的是如何使用Java和Ajax技术来实现一个二级联动的菜单。Ajax，即Asynchronous JavaScript and XML，是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。Java则是后端编程语言，...
"jQuery实现级联地区选择"这个主题就是关于如何利用jQuery库来创建一个动态联动的省份-城市选择器。这个实例包含了JSP（JavaServer Pages）、JavaScript和CSS三个主要部分，旨在提供一种高效、用户友好的选择体验。 ...
在这个“jQuery+ajax实现三级级联”的实例中，我们主要探讨如何利用这两种技术来创建一个能够逐级联动的下拉菜单系统，这在数据筛选和表单填写中十分常见，如地区选择、部门分类等场景。 首先，jQuery是一个轻量级...
在压缩包中的"ajax级联"文件可能包含了实现上述功能的HTML、JavaScript（可能包含jQuery库）和Java代码示例。你可以通过学习这些示例来理解如何将Ajax、JavaScript和Java结合，实现级联下拉框的动态加载效果。 总的...
在本示例中，"Ajax级联下拉列表.rar"是一个关于如何使用Java技术和Ajax实现级联下拉列表的小功能的压缩包。 级联下拉列表是一种常见的前端交互设计，用户在一个下拉列表中做出选择后，第二个或更多的下拉列表会根据...
在级联下拉列表中，我们主要利用jQuery的`change()`事件监听用户在第一个下拉列表中的选择，并触发AJAX请求获取相应的二级数据。 1. **HTML结构**： 创建两个`<select>`元素，分别代表主级和子级的下拉列表。每个`...
前端部分，可以使用Ajax技术来实现实时的数据交互，比如JavaScript库如jQuery或现代的Vue.js、React.js等框架，通过Ajax请求获取服务器上的数据并更新DOM（Document Object Model）以显示新的级联选项。文件名...
在本文中，我们将深入探讨如何使用jQuery库进行AJAX（异步JavaScript和XML）开发，通过实际案例来学习包括级联菜单、谷歌式搜索提示和可编辑表格在内的常见功能。这些功能都允许用户在不刷新整个页面的情况下与网页...
在"ajax_struts_jquery_json级联菜单"的场景中，我们将看到如何利用这四种技术协同工作来创建这样的功能。 首先，Struts框架在后台处理业务逻辑。当用户在前端选择了一个父级菜单项后，Struts Action会接收到这个...
### jQuery + Ajax + JSON 级联：深入解析与应用 在现代Web开发中，级联选择器（Cascade Selectors）是一种常见的用户界面设计模式，主要用于处理多层级的数据选择，如国家-省份-城市的选择。本文将深入探讨如何...
多级级联下拉列表的工作原理是：当用户在一个下拉列表中做出选择时，该选择会触发一个事件，这个事件会发送一个Ajax请求到服务器，服务器根据请求参数返回相应的下一级选项，然后jQuery将这些新数据填充到下一个下拉...
【Ajax级联菜单】是一种常见的前端交互设计，它利用了Asynchronous JavaScript and XML（异步JavaScript和XML）技术，能够实现在用户选择某一项时，无需刷新整个页面就能动态加载和展示相关数据。在本例子中，我们有...
在IT领域，特别是前端开发中，使用jQuery技术实现级联菜单是一种常见的需求，尤其是在复杂的用户界面设计中。本文将深入探讨“Jquery级联”这一主题，解析如何利用jQuery技术来构建动态、交互式的级联菜单，提升用户...
SSH（Spring、Struts2、...总结，这个SSH登录与AJAX级联的demo展示了如何利用SSH框架进行后端业务处理，结合AJAX提供流畅的前端交互。开发者可以通过这个项目学习到如何整合这些技术，提高开发效率和代码质量。
在IT行业中，构建高效、动态的Web应用是关键任务之一，而"ajax+jQuery+ssh+oracle级联实例"提供了一个具体的实现方案。这个实例涵盖了前端到后端的关键技术，包括异步数据交互（Ajax）、JavaScript库（jQuery）、...
【jQuery无限级联】是一种在Web开发中实现下拉列表联动的技术，常见于构建多级导航菜单或选择树形结构的数据。在这个特定的场景中，它用于Java Web项目，允许用户逐级选择嵌套的层级关系，如地区、部门或者类别等。...
通常会有一个服务端脚本（可能是Java编写）处理这些AJAX请求，查询数据库以获取匹配的数据。这需要了解SQL语句，例如`SELECT * FROM table WHERE condition`，并根据用户的选择动态构建查询条件。 6. **安全与性能*...
以下将详细介绍如何使用jQuery EasyUI的Combobox实现级联功能，并结合Java后端处理JSON数据。 首先，理解jQuery EasyUI Combobox的基本用法。Combobox组件在HTML中表现为一个输入框和一个下拉列表，通过JavaScript...