主攻ASP.NET.3.5.MVC架构之重生:省、市,区三级联动(八)
效果图
Models/Repository
----------------------------------------------------------------------------
//ProvinceRepository.cs.cs
/// <summary>
/// 获取一个实体
/// </summary>
/// <param name="id"></param>
/// <returns></returns>
public S_Province GetModel(int id)
{
return context.S_Province.FirstOrDefault(d => d.ProvinceID== id);
}
/// <summary>
/// 获取实体列表
/// </summary>
/// <returns></returns>
public IQueryable<S_Province> GetModelList()
{
return context.S_Province.OrderBy(d => d.ProvinceID);
}
//CityRepository.cs
/// <summary>
/// 获取一个实体
/// </summary>
/// <param name="id"></param>
/// <returns></returns>
public S_City GetModel(int id)
{
return context.S_City.FirstOrDefault(d => d.CityID == id);
}
/// <summary>
/// 获取实体列表
/// </summary>
/// <returns></returns>
public IQueryable<S_City> GetModelList()
{
return context.S_City.OrderBy(d => d.CityID);
}
/// <summary>
/// 根据省份ID获取实体列表
/// </summary>
/// <returns></returns>
public IQueryable<S_City> GetModelListByProvince(int provinceid)
{
return GetModelList().Where(d => d.ProvinceID == provinceid);
}
//DistrictRepository.cs
/// <summary>
/// 获取一个实体
/// </summary>
/// <param name="id"></param>
/// <returns></returns>
public S_District GetModel(int id)
{
return context.S_District.FirstOrDefault(d => d.CityID == id);
}
/// <summary>
/// 获取实体列表
/// </summary>
/// <returns></returns>
public IQueryable<S_District> GetModelList()
{
return context.S_District.OrderBy(d => d.DistrictID);
}
/// <summary>
/// 根据城市ID获取实体列表
/// </summary>
/// <returns></returns>
public IQueryable<S_District> GetModelListByCity(int cityid)
{
return GetModelList().Where(d => d.CityID== cityid);
}
Controller
----------------------------------------------------------------------------
ProvinceRepository provincerepository = new ProvinceRepository();
CityRepository cityrepository = new CityRepository();
DistrictRepository districtrepository = new DistrictRepository();
public ActionResult Index()
{
return View();
}
public JsonResult GetProvince()
{
IQueryable<S_Province> queryResult = provincerepository.GetModelList();
return Json(queryResult.ToList(), JsonRequestBehavior.AllowGet);
}
public JsonResult GetCity(string id)
{
IQueryable<S_City> queryResult = cityrepository.GetModelListByProvince(int.Parse(id));
return Json(queryResult.ToList(), JsonRequestBehavior.AllowGet);
}
public JsonResult GetDistrict(string id)
{
IQueryable<S_District> queryResult = districtrepository.GetModelListByCity(int.Parse(id));
return Json(queryResult.ToList(), JsonRequestBehavior.AllowGet);
}
View
-----------------------------------------------------------------------------------------
<script src="@Url.Content("~/Content/admin/scripts/jquery-1.4.2.min.js")" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
GetByProvince();
$("#ddlSProvince").change(function () { GetByCity() });
$("#ddlSCity").change(function () { GetByDistrict() });
});
function GetByProvince() {
$("#ddlSProvince").empty();
$.getJSON("/VipUser/Register/GetProvince", function (data) {
$.each(data, function (i, item) {
$("<option></option>")
.val(item["ProvinceID"])
.text(item["ProvinceName"])
.appendTo($("#ddlSProvince"));
});
GetByCity();
});
}
function GetByCity() {
$("#ddlSCity").empty();
var url = "/VipUser/Register/GetCity/" + $("#ddlSProvince").val() + "/";
$.getJSON(url, function (data) {
$.each(data, function (i, item) {
$("<option></option>")
.val(item["CityID"])
.text(item["CityName"])
.appendTo($("#ddlSCity"));
});
GetByDistrict();
});
}
function GetByDistrict() {
$("#ddlSDistrict").empty();
var url = "/VipUser/Register/GetDistrict/" + $("#ddlSCity").val() + "/";
$.getJSON(url, function (data) {
$.each(data, function (i, item) {
$("<option></option>")
.val(item["DistrictID"])
.text(item["DistrictName"])
.appendTo($("#ddlSDistrict"));
});
});
}
</script>
<label for="text_area">
省份:</label><select name="select_element" id="ddlSProvince">
</select>
<label for="text_area">
城市:</label><select name="select_element" id="ddlSCity">
</select>
<label for="text_area">
市区:</label><select name="select_element" id="ddlSDistrict">
</select>
----------------------------------------------------------------------------
//ProvinceRepository.cs.cs
/// <summary>
/// 获取一个实体
/// </summary>
/// <param name="id"></param>
/// <returns></returns>
public S_Province GetModel(int id)
{
return context.S_Province.FirstOrDefault(d => d.ProvinceID== id);
}
/// <summary>
/// 获取实体列表
/// </summary>
/// <returns></returns>
public IQueryable<S_Province> GetModelList()
{
return context.S_Province.OrderBy(d => d.ProvinceID);
}
//CityRepository.cs
/// <summary>
/// 获取一个实体
/// </summary>
/// <param name="id"></param>
/// <returns></returns>
public S_City GetModel(int id)
{
return context.S_City.FirstOrDefault(d => d.CityID == id);
}
/// <summary>
/// 获取实体列表
/// </summary>
/// <returns></returns>
public IQueryable<S_City> GetModelList()
{
return context.S_City.OrderBy(d => d.CityID);
}
/// <summary>
/// 根据省份ID获取实体列表
/// </summary>
/// <returns></returns>
public IQueryable<S_City> GetModelListByProvince(int provinceid)
{
return GetModelList().Where(d => d.ProvinceID == provinceid);
}
//DistrictRepository.cs
/// <summary>
/// 获取一个实体
/// </summary>
/// <param name="id"></param>
/// <returns></returns>
public S_District GetModel(int id)
{
return context.S_District.FirstOrDefault(d => d.CityID == id);
}
/// <summary>
/// 获取实体列表
/// </summary>
/// <returns></returns>
public IQueryable<S_District> GetModelList()
{
return context.S_District.OrderBy(d => d.DistrictID);
}
/// <summary>
/// 根据城市ID获取实体列表
/// </summary>
/// <returns></returns>
public IQueryable<S_District> GetModelListByCity(int cityid)
{
return GetModelList().Where(d => d.CityID== cityid);
}
Controller
----------------------------------------------------------------------------
ProvinceRepository provincerepository = new ProvinceRepository();
CityRepository cityrepository = new CityRepository();
DistrictRepository districtrepository = new DistrictRepository();
public ActionResult Index()
{
return View();
}
public JsonResult GetProvince()
{
IQueryable<S_Province> queryResult = provincerepository.GetModelList();
return Json(queryResult.ToList(), JsonRequestBehavior.AllowGet);
}
public JsonResult GetCity(string id)
{
IQueryable<S_City> queryResult = cityrepository.GetModelListByProvince(int.Parse(id));
return Json(queryResult.ToList(), JsonRequestBehavior.AllowGet);
}
public JsonResult GetDistrict(string id)
{
IQueryable<S_District> queryResult = districtrepository.GetModelListByCity(int.Parse(id));
return Json(queryResult.ToList(), JsonRequestBehavior.AllowGet);
}
View
-----------------------------------------------------------------------------------------
<script src="@Url.Content("~/Content/admin/scripts/jquery-1.4.2.min.js")" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
GetByProvince();
$("#ddlSProvince").change(function () { GetByCity() });
$("#ddlSCity").change(function () { GetByDistrict() });
});
function GetByProvince() {
$("#ddlSProvince").empty();
$.getJSON("/VipUser/Register/GetProvince", function (data) {
$.each(data, function (i, item) {
$("<option></option>")
.val(item["ProvinceID"])
.text(item["ProvinceName"])
.appendTo($("#ddlSProvince"));
});
GetByCity();
});
}
function GetByCity() {
$("#ddlSCity").empty();
var url = "/VipUser/Register/GetCity/" + $("#ddlSProvince").val() + "/";
$.getJSON(url, function (data) {
$.each(data, function (i, item) {
$("<option></option>")
.val(item["CityID"])
.text(item["CityName"])
.appendTo($("#ddlSCity"));
});
GetByDistrict();
});
}
function GetByDistrict() {
$("#ddlSDistrict").empty();
var url = "/VipUser/Register/GetDistrict/" + $("#ddlSCity").val() + "/";
$.getJSON(url, function (data) {
$.each(data, function (i, item) {
$("<option></option>")
.val(item["DistrictID"])
.text(item["DistrictName"])
.appendTo($("#ddlSDistrict"));
});
});
}
</script>
<label for="text_area">
省份:</label><select name="select_element" id="ddlSProvince">
</select>
<label for="text_area">
城市:</label><select name="select_element" id="ddlSCity">
</select>
<label for="text_area">
市区:</label><select name="select_element" id="ddlSDistrict">
</select>