主要就是前台js代码,后台就是根据id直接查询的
html代码
<select style="width:130px" name="provinceCode" id="province">
<option value="0">--请选择--</option>
</select>
<select style=" width:130px" id="city" name="cityCode">
<option value="0">--请选择--</option>
</select>
<select style=" width:130px" id="area" name="areaCode">
<option value="0">--请选择--</option>
</select>
js代码
//页面加载显示全部的省
$.ajax({
url:"${pageContext.request.contextPath}/province/findAllProvince",
type:"post",
dataType:"json",
success:function(data){
$(data).each(function(a,b){
if(b.provinceid!=${userComplete.data.provinceCode}){
$("#province").append("<option value='"+b.provinceid+"'>"+b.province+"</option>");
}
});
},
error:function(){
}
});
$("#province").change(function(){
$("#city").empty();
$("#area").empty();
var a = $("#province option:selected").text();
$("#provinceName").val(a);
var pId = $("#province").val();
$("#city").append("<option value='0'>--请选择--</option>");
$("#area").append("<option value='0'>--请选择--</option>");
$.ajax({
url:"${pageContext.request.contextPath}/province/findAllCity",
type:"post",
dataType:"json",
data:{"province":pId},
success:function(data){
$(data).each(function(a,b){
$("#city").append("<option value='"+b.cityid+"'>"+b.city+"</option>");
});
},
error:function(){
}
});
});
$("#city").change(function(){
$("#area").empty();
var pId = $("#city").val();
var a = $("#city option:selected").text();
$("#cityName").val(a);
$("#area").append("<option value='0'>--请选择--</option>");
$.ajax({
url:"${pageContext.request.contextPath}/province/findAllArea",
type:"post",
dataType:"json",
data:{"area":pId},
success:function(data){
$(data).each(function(a,b){
$("#area").append("<option value='"+b.areaid+"'>"+b.area+"</option>");
});
},
error:function(){
}
});
});
controller代码
package com.bgs.controller;
import com.bgs.pojo.City;
import com.bgs.pojo.HatArea;
import com.bgs.pojo.HatCity;
import com.bgs.pojo.HatProvince;
import com.bgs.service.ProvinceService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import java.util.List;
@Controller
@RequestMapping("/province")
public class ProvinceController {
@Autowired
private ProvinceService provinceService;
//获取所有的省信息
@RequestMapping ("/findAllProvince")
@ResponseBody
public List<HatProvince> findAllProvince(){
List<HatProvince> allProvince = provinceService.findAllProvince();
return allProvince;
}
//获取所有城市信息
@RequestMapping("/findAllCity")
@ResponseBody
public List<HatCity> findAllCity(Integer province){
List<HatCity> allCity = provinceService.findAllCity(province);
return allCity;
}
//获取所有的县
@RequestMapping("/findAllArea")
@ResponseBody
public List<HatArea> findAllArea(Integer area){
List<HatArea> allArea = provinceService.findAllArea(area);
return allArea;
}
}