三级联动(教学篇)仅供参考

时间:2019-02-16
本文章向大家介绍三级联动(教学篇)仅供参考,主要包括三级联动(教学篇)仅供参考使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

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>My JSP 'test.jsp' starting page</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="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
 $(function(){
	$.post(
	"city/first",
	function(data){
	var tempArr="";
	if(data!=""){
	for(var i=0;i<data.length;i++){
	tempArr+="<option value='"+data[i].code+"'>"+data[i].name+"</option>";
	}
	$("#province").append(tempArr);
	}
	},
	"json"
	);
$("#province").change(function(){
	var pId=$(this).val();
	getCitys(pId);
	});
	$("#city").change(function(){
	var cId=$(this).val();
	getAreas(cId);
	});
	getCitys(110000);
	getAreas(110100);
});	
//-----------------------------------
	function getCitys(pId){
	$.post(
	"city/second",
	{provinceId:pId},
	function(data){
	var tempArr="";
	if(data!=""){
	$("#city").empty();
	for(var i=0;i<data.length;i++){
	tempArr+="<option value='"+data[i].code+"'>"+data[i].name+"</option>";	
	}
	$("#city").append(tempArr);
	getCitys(data[0].code);
	}
	},
	"json"
	);
	}
//-----------------------------
function getAreas(cId){
$.post(
"city/third",
{cityId:cId},
function(data){
var tempArr="";
if(data!=""){
$("#area").empty();
for(var i=0;i<data.length;i++){
tempArr+="<option value='"+data[i].code+"'>"+data[i].name+"</option>";
}
$("#area").append(tempArr);
getAreas(data[0].code);
}
},
"json"
);
}
</script>
  </head>
  
  <body>
    <center>
    <table>
    <tr>
    <td>选择省:</td>
    <td><select id="province"></select></td>
    </tr>
    <tr>
    <td>选择市:</td>
    <td><select id="city"></select></td>
    </tr>
    <tr>
    <td>选择区:</td>
    <td><select id="area"></select></td>
    </tr>
    </table>
    </center>
  </body>
  </body>
</html>

dao层代码:

package com.aaa.dao;

import java.util.List;
import java.util.Map;

public interface CityDao {
	/**
	 * 得到省
	 */
	List<Map<String,Object>> getAllProvince();
	/**
	 * 得到市
	 */
	List<Map<String, Object>> getCitysByProvinceId(int provinceId);
	/**
	 * 得到区
	 */
	List<Map<String, Object>> getAreasByCityId(int cityId);
}

daoImpl代码:

package com.aaa.dao;

import java.util.List;
import java.util.Map;

import org.springframework.stereotype.Repository;

import com.aaa.util.BaseDao;

@Repository
public class CityDaoImpl implements CityDao{

	public List<Map<String, Object>> getAllProvince() {
		// TODO Auto-generated method stub
		return BaseDao.selectMap("select id,code,name from province", null);
	}

	public List<Map<String, Object>> getCitysByProvinceId(int provinceId) {
		// TODO Auto-generated method stub
		return BaseDao.selectMap("select id,code,name,provincecode from city where provincecode=?", new Object[]{provinceId});
	}

	public List<Map<String, Object>> getAreasByCityId(int cityId) {
		// TODO Auto-generated method stub
		return BaseDao.selectMap("select id,code,name,citycode from area where citycode=?", new Object[]{cityId});
	}

}

service层代码:

package com.aaa.service;

import java.util.List;
import java.util.Map;


public interface CityService {
	/**
	 * 得到省
	 */
	List<Map<String,Object>> getAllProvince();
	/**
	 * 得到市
	 */
	List<Map<String, Object>> getCitysByProvinceId(int provinceId);
	/**
	 * 得到区
	 */
	List<Map<String, Object>> getAreasByCityId(int cityId);
}

serviceImpl代码:

package com.aaa.service;

import java.util.List;
import java.util.Map;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import com.aaa.dao.CityDao;

@Service
public class CityServiceImpl implements CityService{
	@Autowired
	private CityDao cityDao;
	public List<Map<String, Object>> getAllProvince() {
		// TODO Auto-generated method stub
		return cityDao.getAllProvince();
	}

	public List<Map<String, Object>> getCitysByProvinceId(int provinceId) {
		// TODO Auto-generated method stub
		return cityDao.getCitysByProvinceId(provinceId);
	}

	public List<Map<String, Object>> getAreasByCityId(int cityId) {
		// TODO Auto-generated method stub
		return cityDao.getAreasByCityId(cityId);
				
	}

}

controller代码:

@Controller
@RequestMapping("/city")
public class CityController {
	@Autowired
		private CityService cityService;
	@ResponseBody
	@RequestMapping("/first")
	public List<Map<String,Object>> province(){
		List<Map<String, Object>> allProvince=cityService.getAllProvince();
		return allProvince;
	}
	@ResponseBody
	@RequestMapping("/second")
	public List<Map<String,Object>> city(Model model,Integer provinceId){
		List<Map<String, Object>> allCity=cityService.getCitysByProvinceId(provinceId);
		System.out.println(allCity);
		System.out.println(provinceId);
		return allCity;
	}
	@ResponseBody
	@RequestMapping("/third")
	public List<Map<String,Object>> area(Model model,Integer cityId){
		List<Map<String, Object>> allArea=cityService.getAreasByCityId(cityId);
		return allArea;
	}
	
}