MVC 5 下拉列表

Question

因此，我正在使用一些控件自定义一些视图，以允许用户缩小我们期望在页面上看到的结果，因为我们期望得到大量信息。

我的智能感知在 VS2015 中被破坏了，所以我在黑暗中磕磕绊绊。

所以我已经填充了几个下拉列表，月份和年份。不是最漂亮的，但它有效：

@Html.DropDownList("Month", new List<SelectListItem>
           {
                new SelectListItem { Text = "January", Value = "1"},
                new SelectListItem { Text = "February", Value = "2"},
                new SelectListItem { Text = "March", Value = "3"},
                new SelectListItem { Text = "April", Value = "4"},
                new SelectListItem { Text = "May", Value = "5"},
                new SelectListItem { Text = "June", Value = "6"},
                new SelectListItem { Text = "July", Value = "7"},
                new SelectListItem { Text = "August", Value = "8"},
                new SelectListItem { Text = "September", Value = "9"},
                new SelectListItem { Text = "October", Value = "10"},
                new SelectListItem { Text = "November", Value = "11"},
                new SelectListItem { Text = "December", Value = "12"}
           }, "Month")
           @Html.DropDownList("Year", new List<SelectListItem>
            {
                new SelectListItem { Text = Convert.ToString(DateTime.Now.Year - 1), Value = Convert.ToString(DateTime.Now.Year - 1)},
                new SelectListItem { Text = Convert.ToString(DateTime.Now.Year), Value = Convert.ToString(DateTime.Now.Year), Selected = true},
                new SelectListItem { Text = Convert.ToString(DateTime.Now.Year + 1), Value = Convert.ToString(DateTime.Now.Year + 1)},
            }, "Year")

现在，当其中一个下拉列表发生更改时，我想将两个控件的下拉选择发送到此视图的控制器，其中包含 DD 列表的内容。从那里我可以重新加载页面。 MSDN 文档不清楚，因为 DropDownList 的唯一构造函数没有参数，所以我不清楚事件驱动的东西应该放在哪里。

Answer 1

处理此用例的一种方法是将您的 SELECT 元素保留在 form 中，并在选择元素上发生更改事件时提交。

@using (Html.BeginForm("Index","Home",FormMethod.Get))
{
  <!-- your existing code for SELECT elements goes here-->
}

现在您可以在 SELECT 元素上监听 change 事件并提交最接近的表单。

$(function () {

    $("#Year,#Month").change(function() {
        $(this).closest("form").submit();
     });

});

假设 Index 操作方法接受年份和月份作为参数

public ActionResult Index(int? year,int? month)
{
  // Check the year and month values, if not null, use them to filter your data
  // to do  : Return something
}

Answer 2

用表单标签包装元素（发布操作）。

在服务器端创建具有月份和年份参数的模型，例如：

public class MyModel{
    public string Month {get;set;}
    public string Year {get;set;}
}

你的 html 必须是这样的：

   @using (Html.BeginForm("Index", "Home", FormMethod.POST, new { id = "MyForm" })) 
    {
       @Html.DropDownList("Month", *your data*, "select month",   new{ onchange = "document.getElementById('MyForm').submit();" })

       @Html.DropDownList("Year", *your data*, "select year",   new{ onchange = "document.getElementById('MyForm').submit();" })

       <input type='submit' value='make the magic' />
    } 

这一行是绑定你的下拉列表的更改事件，通过 id 找到你的表单并提交它。

new{ onchange = "document.getElementById('MyForm').submit();"