public class Employees { [Key] public int EmployeeId { get; set; } [Required, Display(Name = )] public string EmployeeName { get; set; } [Required, Display(Name = )] public String Address { get; set; } [Required, Display(Name = )] public int Province { get; set; } [Required, Display(Name = )] public int City { get; set; } [Display(Name = )] public String ZipCode { get; set; } [Required, Display(Name = )] public String Phone { get; set; } }

（2）初始化数据

List<Province> provinceList = new List<Province>() { ,Abbr=}, ,Abbr=}, ,Abbr=}, ,Abbr=} };

以及绑定ViewBag到下拉框和控制器上的方法：

[HttpGet] public ActionResult Create() { ViewBag.ProvinceList = provinceList; var model = new Employees(); return View(model); } [HttpPost] public ActionResult Create(Employees model) { if (ModelState.IsValid) { } ViewBag.ProvinceList = provinceList; return View(model); } public ActionResult FillCity(int provinceId) { var cities = new List<City>() { ,provinceId=1}, ,provinceId=2}, ,provinceId=3}, ,provinceId=4} }; cities = cities.Where(s => s.provinceId == provinceId).ToList(); return Json(cities, JsonRequestBehavior.AllowGet); }

 （3）视图展示

@using (Html.BeginForm()) { @Html.AntiForgeryToken() 注册雇员 @Html.LabelFor(m => m.EmployeeName, new { @class = "control-label col-md-2" }) @Html.TextBoxFor(m => m.EmployeeName, new { @class = "form-control" }) @Html.ValidationMessageFor(m => m.EmployeeName, "", new { @class = "text-danger" }) @Html.LabelFor(m => m.Address, new { @class = "control-label col-md-2" }) @Html.TextBoxFor(m => m.Address, new { @class = "form-control" }) @Html.ValidationMessageFor(m => m.Address, "", new { @class = "text-danger" }) @Html.LabelFor(m => m.Province, new { @class = "control-label col-md-2" }) @Html.DropDownListFor(m => m.Province, new SelectList(ViewBag.ProvinceList, "provinceId", "provinceName"), "选择所在省", new { @class = "form-control", @onchange = "FillCity()" }) @Html.ValidationMessageFor(m => m.Province, "", new { @class = "text-danger" }) @Html.LabelFor(m => m.City, new { @class = "control-label col-md-2" }) @Html.DropDownListFor(m => m.City, new SelectList(Enumerable.Empty(), "CityId", "CityName"), "选择所在市", new { @class = "form-control" }) @Html.ValidationMessageFor(m => m.City, "", new { @class = "text-danger" }) @Html.LabelFor(m => m.ZipCode, htmlAttributes: new { @class = "control-label col-md-2" }) @Html.TextBoxFor(m => m.ZipCode, new { @class = "form-control" }) @Html.ValidationMessageFor(m => m.ZipCode, "", new { @class = "text-danger" }) @Html.LabelFor(m => m.Phone, new { @class = "control-label col-md-2" }) @Html.TextBoxFor(m => m.Phone, new { @class = "form-control" }) @Html.ValidationMessageFor(m => m.Phone, "", new { @class = "text-danger" }) Cancel }

（4）根据省下拉框选择到市下拉框脚本

function FillCity() { var provinceId = $('#Province').val(); $.ajax({ url: '/Home/FillCity', type: "GET", dataType: "JSON", data: { provinceId: provinceId }, success: function (cities) { $("#City").html(""); $.each(cities, function (i, city) { $("#City").append( $('<option></option>').val(city.CityId).html(city.CityName)); }); } }); }

我们来看看整个过程：

 对于下拉框绑定基本上已全部囊括进去，不断钻研，不断总结才能有能力上更好的提升。希望对阅读本文的你有所帮助，如果有帮助，不妨讨打（乞讨打赏）一下，1块也是爱:)。