如何在ASP.NET MVC中处理大量的下拉菜单

时间:2017-04-03 13:30:55

标签: asp.net asp.net-mvc

我们正在从Webforms转向ASP.NET MVC。

我们的主页最多可以有130个下拉列表,每个下拉列表的列表中有5到50个值。

在webforms /代码背后,这是一件简单的事情。但是在MVC中,后面的代码中没有服务器控件,似乎处理这个问题的唯一方法就是传入一个在字段名称上索引的巨型json字符串,然后依靠jQuery解析出来。

有什么建议吗?

2 个答案:

答案 0 :(得分:0)

您可以在View

中添加Html帮助器 控制器中的

public ActionResult Index(string val, bool? inStock)
    {
        var viewModel = new ItemSearchViewModel();
        viewModel.ListOfItems = new SelectList(_service.GetListOfItem(), "ItemID", "ItemName"); //field to use ItemID as value ItemName as text
        return View(viewModel);
    }

在视图

@Html.DropDownList("ItemDropdown1", Model.ListOfItems, "Select Item...")

您可以在here

中查看下拉菜单

答案 1 :(得分:0)

只是为了扩大@fedri的答案.....

由于您有很多下拉菜单,我强烈建议您使用viewmodel类来组织下拉列表。 (我不知道为什么你有这么多的下拉菜单,因为它确实看起来过多了,但我想这个设计有它的原因)。

首先,视图模型只是class,例如

public class IndexViewModel
{
    public List<SelectListItem> Dropdown1 { get; set; }

    public string Dropdown1SelectedItem { get; set; }
}

我通过将它的一个实例传递给视图来使用这个视图模型。

public class HomeController : Controller
{
    public ActionResult Index()
    {
        var viewModel = new IndexViewModel();

        viewModel.Dropdown1 = new List<SelectListItem>();

        viewModel.Dropdown1.Add(new SelectListItem() { Text = "Item 1", Value = "23" });

        return View(viewModel);
    }
}


@model WebApplication3.Controllers.IndexViewModel

@using (Html.BeginForm())
{
    @Html.DropDownList(nameof(Model.Dropdown1SelectedItem), Model.Dropdown1, "Select item...")
    <input type="submit" value="Save" />
}

当我回发数据时,Dropdown1的选定值存储在Dropdown1SelectedItem中。

[HttpPost]
public ActionResult Index(IndexViewModel viewModel)
{
    //viewModel.Dropdown1SelectedItem will contain the Value property of the item you selected.

    return View();
}

这很简单,可以让你开始运行。困难的部分是组织你的viewmodel以满足如此多的下拉菜单,以防你最终迷路。但是,如果您足够好地命名下拉属性,那么我认为它不应该太糟糕。

编辑:

如果你必须通过AJAX / jQuery传回下拉数据,而不是从回发传递,那么我不知道如何使用JSON结构来传递数据是行不通的。在这种情况下,我会强烈关注设计,并审查是否有100多个下拉列表在一次点击中回发数据是明智的。