我有一个返回表格的 MVC Web 应用程序。我想向视图页面添加一个下拉列表,将表格过滤到选定的年份。什么是正确的方法?
我目前正在创建一个使用 JQuery 填充的下拉列表。我创建了一个 onChange 命令来回发,但我不知道如何获取控制器中下拉列表的选定值。
以下是我的代码片段:
在控制器中:
public ActionResult Index()
{
int year = 2012;
var vu_Estimates = dbBudget.vu_Estimates.OrderByDescending(o => o.Expense).ThenBy(o => o.CategoryGroupSortOrder).ThenBy(o => o.SortOrder).Where(o => o.Year == year).ToList();
return View(vu_Estimates);
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Index(FormCollection formCollection)
{
int year = 2012;
var vu_Estimates = dbBudget.vu_Estimates.OrderByDescending(o => o.Expense).ThenBy(o => o.CategoryGroupSortOrder).ThenBy(o => o.SortOrder).Where(o => o.Year == year).ToList();
return View(vu_Estimates);
}
在视图中,我有以下内容:
<script type="text/javascript">
$(document).ready(function () {
$.post("/Estimate/PopulateYears/", { Year: $(this).val() }, function (data) {
populateDropdown($("#ddlYears"), data);
});
});
function populateDropdown(select, data) {
select.html('');
$.each(data, function (id, option) {
select.append($('<option></option>').val(option.value).html(option.name));
});
}
</script>
<h2>Estimates List</h2>
<div>
<% using (Html.BeginForm()) { %>
<select id="ddlYears" onchange="this.form.submit();"></select> | <%: Html.ActionLink("Create New Year of Estimates", "CreateEstimates", "Estimate") %>
<%} %>
</div>
<table>
<tr>
<th></th>
<th>
EstimateID
</th>
<th>
CategoryID
</th>
<th>
Year
</th>
<th>
EstimateAmount
</th>
<th>
CategoryName
</th>
<th>
SortOrder
</th>
<th>
CategoryGroupSortOrder
</th>
<th>
Expense
</th>
</tr>
<% foreach (var item in Model) { %>
<tr>
<td>
<%: Html.ActionLink("Edit", "Edit", new { id=item.EstimateID }) %> |
<%: Html.ActionLink("Delete", "Delete", new { id=item.EstimateID })%>
</td>
<td>
<%: item.EstimateID %>
</td>
<td>
<%: item.CategoryID %>
</td>
<td>
<%: item.Year %>
</td>
<td>
<%: item.EstimateAmount %>
</td>
<td>
<%: item.CategoryName %>
</td>
<td>
<%: item.SortOrder %>
</td>
<td>
<%: item.CategoryGroupSortOrder %>
</td>
<td>
<%: item.Expense %>
</td>
</tr>
<% } %>
</table>
<p>
<%: Html.ActionLink("Create New", "Create") %>
</p>