Question

我在使用此下拉框时遇到问题，似乎无法正确使用，这是代码：

查看（Index.cshtml）：

@using EvaSimulator.Models
@Model EvaSimulator.Models.ModelVariables
@{
    ViewBag.Title = "Index";
    ModelVariables mv = new ModelVariables();
}
@using (Html.BeginForm("DropDownBox", "Home", FormMethod.Get))
{
    @Html.DropDownList("dropdownbox", )
    <button type="submit"></button>
}
<p>@Model.dropDownList</p>

Model（ModelVariables.cs）：

public string dropDownList = "";

Controller（HomeController.cs）：

public ActionResult DropDownBox(string dropdownbox)
{
    ModelVariables mv = new ModelVariables();
    mv.dropDownList = dropdownbox;
    return this.View("Index", mv);
}

这只是看起来正确，我只是寻找一个简单的解决方案，创建一个下拉多个选择列表框和我提交的任何内容，我得到值列表并在<p>打印它们视图中的标记（@Model.dropDownList）

Answer 1

首先，您应该为视图模型类添加一个新属性，以获取类型为IEnumerable<SelectListItem>的下拉数据。我们将添加数组类型的第二个属性（，因为您需要多选）来保存所选的选项值。

public class ModelVariables
{
  public IEnumerable<SelectListItem> Options {set;get;}
  public string[] SelectedOptions { set;get;}
}

现在，在您的GET操作中，创建此视图模型的对象，填充Options属性并发送到视图。

public ActionResult Create()
{
  var vm = new ModelVariables();
  vm.Options = new List<SelectListItem> {
     new SelectListItem { Value="MI", Text="Michigan" },
     new SelectListItem { Value="NY", Text="New York" },
  };
  return View(vm);
}

现在在您看来，使用Html.ListBoxFor辅助方法

@model ModelVariables
@using(Html.BeginForm())
{ 
   <label> Select items <label>
   @Html.ListBoxFor(s=>s.SelectedOptions,Model.Options)
   <input type="submit" />
}

现在，在您的HttpPost操作中，您可以使用与方法参数相同的视图模型，并且模型绑定器将能够将发布的表单数据映射到该对象。 UI中的选定选项将在视图模型对象的SelectedOptions属性中提供。

[HttpPost]
public ActionResult Create(ModelVariables model)
{
  // check model.SelectedOptions property value
 // to do : Return something
}

Answer 2

使用For帮助程序来进行编译时检查。使用MultiSelectList时，我们需要将选定的值绑定到第一个参数中的数组，然后您可以传递选择列表，并在第二个参数中显示值。

 public string[] SelectedValues { get; set; }

 public MultiSelectList DropDownList { get; set; }

控制器：

 mv.DropDownList = new MultiSelectList(/*Your list of items here*/)

查看：

 @Html.DropDownListFor(x => Model.SelectedValues, Model.DropDownList)

如何MVC 5下拉（多选）框

2 个答案: