主攻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>