如何MVC 5下拉（多選）框

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>

模型（ModelVariables.cs）：

public string dropDownList = "";

控制器（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 helper方法

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

現在，在HttpPost操作中，您可以擁有與方法參數相同的視圖模型，並且Model Binder將能夠將發布的表單數據映射到該對象的對象。 從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)