select多选框省市县三级级联

最新推荐文章于 2024-03-20 15:50:35 发布

Personality、

最新推荐文章于 2024-03-20 15:50:35 发布

阅读量618

点赞数 1

分类专栏：笔记文章标签： json servlet

本文链接：https://blog.csdn.net/qq_43527694/article/details/107615636

版权

笔记专栏收录该内容

78 篇文章 1 订阅

订阅专栏

通过“模块化开发”的方式来实现三级级联：

test.jsp:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
	<head>
		<title>Insert title here</title>
		<script type="text/javascript" src="./js/jquery-1.8.3.min.js"></script>
		<script type="text/javascript" src="./js/json2.js"></script>
		<script type="text/javascript">
		var obj={
				url:"./AreaServlet",
				dataType:"text",
				success:function(data){
				data=JSON.parse(data);
				var options ="<option value=''>--请选择--</option>";
					for(var i=0;i<data.length;i++){
						var obj = data[i];
						options = options+"<option value="+obj.code+">"+obj.name+"</option>";
					}
					$("#province").empty();
				    $("#province").append(options);
						}
				};
				$.ajax(obj);
					
			function getCity(){
				var parentCode=$("#province").val();
				if(parentCode==""){//加此判断是因为默认从AreaService传入到AreaDao的parentCode就为"",即默认是省选项，因此通过本判断来阻止该现象的发生，同时当省选项变化为"--请选择--"时，通过该判断可以清空市县选项框。
					$("#city").empty();
					$("#county").empty();
					$("#city").append("<option value=''>--请选择--</option>");
					$("#county").append("<option value=''>--请选择--</option>");
					return;
				}
				var obj={	
						url:"./AreaServlet?parent_code="+parentCode,
						dataType:"text",
						success:function(data){
						data=JSON.parse(data);
						var options ="<option value=''>--请选择--</option>";
						for(var i=0;i<data.length;i++){
							    var obj = data[i];
								options = options+"<option value="+obj.code+">"+obj.name+"</option>";
								}
							$("#city").empty();
							$("#county").empty();
							$("#city").append(options);
							$("#county").append("<option value=''>--请选择--</option>");
								
								}
						};
						$.ajax(obj);
				}
				
				function getCounty(){
					var parentCode=$("#city").val();
					if(parentCode==""){//该判断是当市级选项卡改变时，自动将县级选项卡清空
						$("#county").empty();
						$("#county").append("<option value=''>--请选择--</option>");
						return;
					}
					var obj={
							url:"./AreaServlet?parent_code="+parentCode,
							dataType:"text",
							success:function(data){
								data=JSON.parse(data);
								var options ="<option value=''>--请选择--</option>";
								for(var i=0;i<data.length;i++){
									var obj = data[i];
									options = options+"<option value="+obj.code+">"+obj.name+"</option>";
								}
								$("#county").empty();
								$("#county").append(options);
							}
					};
					$.ajax(obj);
			};
		</script>	
	</head>
	<body>
		<select id="province" onchange="getCity()">
			<option value="">--请选择--</option>
		</select>
		<select id="city" onchange="getCounty()">
			<option value="">--请选择--</option>
		</select>
		<select id="county">
			<option value="">--请选择--</option>
		</select>
	</body>
</html>

AreaServlet:

package area.servlet;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.google.gson.Gson;

import area.imp.IAreaService;
import area.service.AreaService;

public class AreaServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
	private IAreaService areaService = new AreaService();
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		response.setContentType("text/plain; charset=UTF-8");
		String parentCode = request.getParameter("parent_code");
		String json = new Gson().toJson(areaService.select(parentCode));
		System.out.println(json);
		PrintWriter out = response.getWriter();
		out.write(json);
		out.flush();
		out.close();
		
	}
	
}

AreaService:

package area.service;

import java.util.List;

import com.jd.vo.Area;

import area.dao.AreaDao;
import area.imp.IAreaDao;
import area.imp.IAreaService;

public class AreaService implements IAreaService {
	private IAreaDao areaDao = new AreaDao();

	@Override
	public List<Area> select(String parentCode) {
		if(parentCode==null) {//该判断是让parentCode为空时让null转换为"",从而符合数据库表中的查询规范
			parentCode="";
		}
		return areaDao.select(parentCode);
	}
}

AreaDao:

package area.dao;

import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.List;

import com.jd.tool.db.DBLink;
import com.jd.tool.db.IRowMapper;
import com.jd.vo.Area;

import area.imp.IAreaDao;

public class AreaDao implements IAreaDao {
	@Override
	public List<Area> select(String parentCode) {
		String sql = "select * from area where parent_code='"+parentCode+"'";
		final List<Area>LIST = new ArrayList<Area>();
		new DBLink().select(sql,new IRowMapper(){
		
			public void rowMapper(ResultSet rs) {
				try {
					while(rs.next()) {
						LIST.add( new Area(rs.getString("id"), rs.getString("code"), rs.getString("name") , rs.getString("parent_code") ));
					}
				} catch (SQLException e) {
					e.printStackTrace();
				}
			}
		});
		
		return LIST;
	}
}

IAreaService:

package area.imp;

import java.util.List;

import com.jd.vo.Area;

public interface IAreaService {
	List<Area> select(String parentCode);
}

IAreaDao:

package area.imp;

import java.util.List;

import com.jd.vo.Area;

public interface IAreaDao {
	List<Area> select(String parentCode);
}

Personality、

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
select多选框省市县三级级联

通过“模块化开发”的方式来实现三级级联：test.jsp:<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html><html> <head> <title>Insert title here</title> <script type="text/javas
复制链接

扫一扫