如何根据 HtmlHelper DropDownList 的选定值更改页面上的内容？答案

【问题标题】：How can I change content on my page based on the selected value of an HtmlHelper DropDownList?如何根据 HtmlHelper DropDownList 的选定值更改页面上的内容？
【发布时间】：2009-05-22 01:39:13
【问题描述】：

我正在使用 ASP.NET MVC，并希望根据 HtmlHelper.DropDownList 的选定值更新我的页面上的内容。我有一个管理页面，我想在该页面上显示给定学期的雇用员工列表，而无需重定向到另一个控制器。也许可以生成一个表格或一个列表框，其中包含这些用户。

在我的数据库中，我有一个包含学期列表的表，一个包含用户列表的表，以及另一个包含两个与 FK 相关的字段的表，这些字段将每个学期与为其雇用的所有用户联系起来。

有什么想法吗？

【问题讨论】：

您想在页面上更改什么？一个标题，另一个标签
我会更新帖子。我想生成一个表格，或者填写一个列表框。我只需要在页面上获取该招聘列表即可。

标签： jquery asp.net-mvc ajax linq-to-sql drop-down-menu

【解决方案1】：

有一个返回包含标记的 PartialViewResult 的操作。您的下拉列表将以学期作为文本，将关联的数据库键作为值。将更改处理程序添加到下拉列表，该处理程序执行 AJAX 获取呈现部分视图的操作并将学期键值作为 url 的一部分传递给方法。用 AJAX 查询的结果替换应该保存部分视图的容器。

查看

$(function() {
  $('#SemesterSelect').change( function() {
      $.get( '<%= Url.Action('ListEmployees') %>/' + $(this).val(), function(data) {
         $('#EmployeeList').html(data);
      },
      'html');
  });
});


<%= Html.DropDownList("SemesterSelect",
                        (IEnumerable<SelectListItem>)ViewData["Semesters"]) %>

<div id="EmployeeList"></div>

PartialView（示例 -- IEnumerable 类型）

<ul>
<% foreach (var employee in Model)
   { %>
       <li> <%= employee.Name %> </li>
<% } %>
</ul>

控制器

public ActionResult ListEmployees( int semesterID )
{
     var employees = db.... // query to get employees
     return PartialView("EmployeeList", employees)
}

【讨论】：

这正是我想要的！感谢一百万 =D