重置元素后刷新下拉列表

我有一个asp.net mvc 2应用程序，并有一些jquery定义两个下拉列表的行为。 当一个更改时，另一个填充过滤数据。 经过多次努力，我有jquery工作，由firebug调试确认，但我的下拉列表并不令人耳目一新。 这是jquery

 $(function () { $('#cid').change(function () { var coid = $(this).val(); $.post("/TimeTracking/FilterFieldOffices", { companyId: coid }, function (data) { $("#foid").loadSelect(data); }); }); }); $(function () { $.fn.loadSelect = function (data) { return this.each(function () { this.options.length = 0; $.each(data, function (index, itemData) { var option = new Option(itemData.Text, itemData.Value); this.add(option); }); }); }; });  

这是我的控制器动作

 public ActionResult FilterFieldOffices(int companyId = 0) { IList list = _fodp.GetFieldOfficesForCompany(companyId); var returnList = new SelectList(list, "Id", "FacilityName"); return Json(returnList); } 

所以，我知道dropdownlist正在填充正确的数据，但视图页面上的下拉列表并不令人耳目一新。 我对JQuery的知识有限，所以如果我错过了n00b就像是温柔的。

Answer 1

试试这个：

 $(function () { $.fn.loadSelect = function (data) { return this.each(function () { this.options.length = 0; var select = this; $.each(data, function (index, itemData) { var option = new Option(itemData.Text, itemData.Value); $(select).append(option); }); }); }; }); 

请注意，我们需要在外部foreach中捕获this ，因为在内部它不再指向select元素。

完整的工作示例：

模型：

 public class Item { public int Value { get; set; } public string Text { get; set; } } public class MyViewModel { public int? SelectedCompanyId { get; set; } public int? SelectedFieldOfficeId { get; set; } public IEnumerable Companies { get; set; } public IEnumerable FieldOffices { get; set; } } 

控制器：

 [HandleError] public class HomeController : Controller { public ActionResult Index() { var model = new MyViewModel { Companies = Enumerable.Range(1, 5).Select(i => new Item { Value = i, Text = "Company " + i }), FieldOffices = Enumerable.Empty() }; return View(model); } public ActionResult FilterFieldOffices(int companyId) { return Json(Enumerable.Range(1, 3).Select(i => new Item { Value = i, Text = "Field offfice " + i })); } } 

视图：

   <% using (Html.BeginForm()) { %> <%: Html.DropDownListFor(x => x.SelectedCompanyId, new SelectList(Model.Companies, "Value", "Text"), new { id = "cid" })%> <%: Html.DropDownListFor(x => x.SelectedFieldOfficeId, new SelectList(Model.FieldOffices, "Value", "Text"), new { id = "foid" })%>  <% } %>