ASP.net mvc对DropDown值更改的调用操作

时间:2010-10-13 03:58:45

标签: asp.net-mvc-2 drop-down-menu client-side

我的一个观点有一个下拉列表。此下拉列表仅适用于条目。基本上我需要知道如何在下拉值更改时调用操作?

我的情况是:我正在制作一个简单的收件箱页面。下拉列表包含过滤选项:查看全部,查看邀请,查看回复等。

当用户从下拉列表中选择过滤器选项时,我想调用一个操作来返回带有过滤数据的新视图。

有什么想法吗?我猜它是某种方式将附加到下拉列表的OnChange的脚本,但我不知道语法是什么或如何从脚本调用MVC操作。

提前致谢

1 个答案:

答案 0 :(得分:7)

你需要使用javascript。这是一个例子。假设您有以下视图模型:

public class MyViewModel
{
    public IEnumerable<SelectListItem> Values { get; set; }
}

您将在控制器中填充:

[HandleError]
public class HomeController : Controller
{
    public ActionResult Index()
    {
        var model = new MyViewModel
        {
            Values = new[] 
            {
                new Item { Value = "1", Text = "Item 1" },
                new Item { Value = "2", Text = "Item 2" },
                new Item { Value = "3", Text = "Item 3" }
            }
        };
        return View(model);
    }
}

然后是强烈输入此模型的视图:

<%: Html.DropDownListFor(x => x.SelectedValue, 
    new SelectList(Model.Values, "Value", "Text"), 
    new { id = "items" }
)%>

最后一部分是注册change事件(在本例中使用jquery):

$(function () {
    // Register for the change event of the drop down
    $('#items').change(function () {
        // When the value changes, get send an AJAX request to the
        // Filter action passing the selected value and update the
        // contents of some result div with the partial html returned
        // by the controller action
        $('#result').load('<%: Url.Action("filter") %>', 
            { selectedValue: $(this).val() }
        );
    });
});