1.建一个mvc3的项目,取名叫MVC3Test(事先安装mvc3 version:1.13.113.0) 2.修改About.cshtml,如下代码 About.cshtml @{ ViewBag.Title = "About Us"; } <script type="text/javascript"> $(function () { $.ajax({ url: "/Home/GetSchools", type: "POST", contentType: "application/json; charset=utf-8", data: "{}", dataType: "json", success: function (data) { $("#sltSchool").empty(); $("#sltSchool").html(data); }, error: function ErrorCallback(XMLHttpRequest, textStatus, errorThrown) { alert(errorThrown + ":" + textStatus); } }); // Get the departments depend on the school $("#sltSchool").change(function () { GetDepartments($("#sltSchool").val()); }); }); function GetDepartments(sId) { $.ajax({ url: "/Home/GetSecondCatalog", type: "POST", contentType: "application/json; charset=utf-8", data: "{schoolId:"+sId+"}", dataType: "json", success: function (data) { $('#sltDepartment').empty(); $('#sltDepartment').html(data); }, error: function ErrorCallback(XMLHttpRequest, textStatus, errorThrown) { alert(errorThrown + ":" + textStatus); } }); } </script> <div> <h2> About</h2> <p> Put content here. </p> <div> <span> <label> School : </label> <select id="sltSchool"> <option value="-1">select...</option> </select></span> <span style="margin-left: 50px"> <label> Department :</label> <select id="sltDepartment"> <option value="-1">select...</option> </select> </span> </div> </div> 3.创建几个model (1) TestSchool.cs TestSchool using System; using System.Collections.Generic; using System.Linq; using System.Web; namespace MVC3Test.Models { public class TestSchool { public int Id { get; set; } public string Name { get; set; } } } (2) TestSchoolDepartment.cs TestSchoolDepartment.cs using System; using System.Collections.Generic; using System.Linq; using System.Web; namespace MVC3Test.Models { public class TestSchoolDepartment { public int Id { get; set; } public int SchoolId { get; set; } public string Name { get; set; } } } (3) TestModels.cs TestModels.cs using System; using System.Collections.Generic; using System.Linq; using System.Web; namespace MVC3Test.Models { public class TestModels { public static List<TestSchool> GetAllSchools() { return new List<TestSchool>() { new TestSchool{Id=1,Name="ABC"}, new TestSchool{Id=2,Name="DEF"}, new TestSchool{Id=3,Name="HIJ"}, new TestSchool{Id=4,Name="LMN"} }; } public static List<TestSchoolDepartment> GetAllDepartment() { return new List<TestSchoolDepartment>() { new TestSchoolDepartment{Id=1,SchoolId=1,Name="ABC_D1"}, new TestSchoolDepartment{Id=2,SchoolId=1,Name="ABC_D2"}, new TestSchoolDepartment{Id=3,SchoolId=1,Name="ABC_D3"}, new TestSchoolDepartment{Id=4,SchoolId=2,Name="DEF_D1"}, new TestSchoolDepartment{Id=5,SchoolId=2,Name="DEF_D2"}, new TestSchoolDepartment{Id=6,SchoolId=3,Name="HIJ_D1"}, new TestSchoolDepartment{Id=7,SchoolId=3,Name="HIJ_D2"}, new TestSchoolDepartment{Id=8,SchoolId=3,Name="HIJ_D3"}, new TestSchoolDepartment{Id=9,SchoolId=3,Name="HIJ_D4"}, new TestSchoolDepartment{Id=10,SchoolId=4,Name="LMN_D1"} }; } public static List<TestSchoolDepartment> GetDepartmentBySchoolId(int schoolId) { List<TestSchoolDepartment> testSchoolDepartment = new List<TestSchoolDepartment>(); foreach (TestSchoolDepartment department in GetAllDepartment()) { if (department.SchoolId == schoolId) { testSchoolDepartment.Add(department); } } return testSchoolDepartment; } } } 4.由于About是在Home页面里的,所以它的controller应该在HomeController里,我们添加两个controller,如下: using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; using MVC3Test.Models; using System.Text; namespace MVC3Test.Controllers { public class HomeController : Controller { public ActionResult Index() { ViewBag.Message = "Welcome to ASP.NET MVC!"; return View(); } public ActionResult About() { return View(); } [HttpPost] public JsonResult GetSchools() { StringBuilder sb = new StringBuilder(); sb.Append("<option value=\"-1\">select...</option>"); foreach (var item in TestModels.GetAllSchools()) { sb.AppendFormat("<option value=\"{0}\">{1}</option>", item.Id, item.Name); } string result = sb.ToString(); return this.Json(result, JsonRequestBehavior.AllowGet); } [HttpPost] public JsonResult GetSecondCatalog(int schoolId) { StringBuilder sb = new StringBuilder(); sb.Append("<option value=\"-1\">select...</option>"); foreach (var item in TestModels.GetDepartmentBySchoolId(schoolId)) { sb.AppendFormat("<option value=\"{0}\">{1}</option>", item.Id, item.Name); } string result = sb.ToString(); return this.Json(result, JsonRequestBehavior.AllowGet); } } }