省市级联查询实例：JDBC+Servlet+JSP+JSON+jQuery+Ajax
两个实体类就不写了
Province(Integer id, String name, String jiancheng, String shenghui)
City(Integer id, String name, Integer provinceId)
下面是DAO
package com.luna.dao;
//这里用了自己写的JDBC工具类
public class QueryDao {
Connection conn=null;
PreparedStatement ps=null;
ResultSet rs=null;
//查询所有的省份信息
public List<Province> provinceQuery(){
String sql="select * from province";
List<Province> list=new ArrayList<>();
try {
conn=JDBCUtil.getConnection();
ps= conn.prepareStatement(sql);
rs=ps.executeQuery();
while (rs.next()){
Integer id=rs.getInt("id");
String name=rs.getString("name");
String jiancheng=rs.getString("jiancheng");
String shenghui=rs.getString("name");
Province province=new Province(id,name,jiancheng,shenghui);
list.add(province);
}
} catch (SQLException throwables) {
throwables.printStackTrace();
}finally {
JDBCUtil.close(conn,ps,rs);
}
return list;
}
//根据省份查询所有的城市信息
public List<City> cityQuery(Integer provinceId){
String sql="select * from city where provinceId=?";
List<City> list=new ArrayList<>();
try {
conn=JDBCUtil.getConnection();
ps= conn.prepareStatement(sql);
ps.setInt(1,provinceId);
rs=ps.executeQuery();
while (rs.next()){
Integer id=rs.getInt("id");
String name=rs.getString("name");
City city=new City(id,name,provinceId);
list.add(city);
}
} catch (SQLException throwables) {
throwables.printStackTrace();
}finally {
JDBCUtil.close(conn,ps,rs);
}
return list;
}
}
ProvinceQueryServlet+CityQueryServlet
public class ProvinceQueryServlet extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String json="{}";
QueryDao queryDao=new QueryDao();
List<Province> list=queryDao.provinceQuery();
//把list转为json格式的数据 输出给ajax请求
if(null!=list){
ObjectMapper om=new ObjectMapper();
json=om.writeValueAsString(list);
}
//输出json数据 响应ajax请求 返回数据
response.setContentType("application/json;charset=utf-8");
PrintWriter pw=response.getWriter();
pw.write(json);
pw.flush();
pw.close();
}
}
public class CityQueryServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String provinceId=request.getParameter("provinceId");
if(provinceId !=null && provinceId.trim().length()>0){//得到的参数不为空
String json="{}";
QueryDao dao=new QueryDao();
List<City> list= dao.cityQuery(Integer.valueOf(provinceId));
if(null!=list){
ObjectMapper om=new ObjectMapper();
json=om.writeValueAsString(list);
}
response.setContentType("application/json;charset=utf-8");
PrintWriter pw=response.getWriter();
pw.write(json);
pw.flush();
pw.close();
}
}
}
JSP页面
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>省市级联查询</title>
<script type="text/javascript" src="js/jquery-3.4.1.js"></script>
</head>
<body>
<script type="text/javascript">
$(function(){//页面的dom对象加载成功后执行
$.ajax({
url:"provinceQuery",
dataType:"json",
success:function(resp) {//pw向页面输出什么 这里的形参就是什么 resp就是json数据
//每次点击按钮 就会执行一次append 这是不正确的 因此需要把之前的数据清空
$("#province").empty();
//遍历resp i是循环变量 n是每次循环的值resp[i]
$.each(resp,function(i,n){
//向下拉列表追加option 放入得到的resp 也就是json值
$("#province").append("<option value='"+n.id+"'>"+n.name+"</option>");
})
}
})
//给省份的select绑定change事件 当select内容发生变化时 触发该事件
$("#province").change(function(){
var $obj=$("#province>option:selected");
//alert($obj.val()+"==="+$obj.text());//点击河北 alert 1===河北
var provinceId=$obj.val();
//做一个ajax请求 使用post函数(请求地址，请求参数，处理函数，数据格式)
$.post("cityQuery",{provinceId:provinceId},callback,"json");
})
function callback(resp) {
$("#city").empty();
$.each(resp,function (i,n){
$("#city").append("<option value='"+n.id+"'>"+n.name+"</option>");
})
}
})
</script>
<div>
<table>
<tr>
<td>省份:</td>
<td>
<select id="province">
<option value="0">--请选择--</option>
</select>
</td>
<td>
<input type="button" value="load数据" id="btnLoad">
</td>
</tr>
<tr>
<td>城市:</td>
<td>
<select id="city">
<option value="0">--请选择--</option>
</select>
</td>
</tr>
</table>
</div>
</body>
</html>