ModelBinding綁定SelectedItem

Question

如何使用ModelBinding將SelectedItem綁定到我的模型？

首先，我創建一個簡單模型：

public class Element
{
    public string Name { get; set; }
    public int Value { get; set; }
}
public class MyModel
{
    public Guid ContactID { get; set; }
    public List<Element> Collection { get; set; }

    public IEnumerable<SelectListItem> SelectList
    {
        get
        {
            return Collection.Select
            (
                e => new SelectListItem
                {
                    Text = e.Name,
                    Value = e.Value.ToString()
                }
            );
        }
    }

    public Element SelectedElement { get; set; }

}

然后在我的控制器中初始化它：

    public ActionResult Test()
    {
        var model = new MyModel {ContactID = Guid.NewGuid(), Collection = new List<Element>() };
        var rand = new Random();

        while (model.Collection.Count < 10)
        {
            var number = rand.Next(100);
            model.Collection.Add(new Element {Value = number, Name = number.ToString()});
        }

        return View(model);
    }

並在我的視圖中顯示它：

@using (Html.BeginForm("TestPostBack", "Home"))
{
    @Html.AntiForgeryToken()

<div class="form-horizontal">
    <h4>MyModel</h4>
    <hr />
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    <div class="form-group">
        @Html.LabelFor(model => model.ContactID, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.EditorFor(model => model.ContactID, new { htmlAttributes = new { @class = "form-control" } })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.Collection, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownListFor(model => model.SelectedElement, Model.SelectList)
        </div>
    </div>

    <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
            <input type="submit" value="Save" class="btn btn-default" />
        </div>
    </div>
</div>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

當我在表單上按下提交按鈕時，我想在控制器上點擊TestPostBack 。 那也沒問題。 但是，如何在模型中填寫SelectedElement屬性呢？ 我希望它是下拉菜單中所選項目的值。

public ActionResult TestPostBack(MyModel model)
{
    throw new NotImplementedException();
}

Answer 1

我認為將整個對象取回並不是一件容易的事。 不是沒有，只是沒有容易。 這里的問題是，與HTML select元素相對應的下拉列表僅回發了選項的選定值，而沒有文本。 因此，人們可能會想到攔截表單發布請求並在其中添加文本，但這感覺有些不客氣。

最直接的方法是只取回價值：

public class MyModel
{
    ...
    public int SelectedElementValue { get; set; }
}

Html.DropDownListFor(model => model.SelectedElementValue, Model.SelectList)

然后通過值在元素之間查找對象。 希望他的價值是獨一無二的：

public ActionResult TestPostBack(MyModel model)
{
    // load list of elements
    Element selectedElement = //look up element by model.SelectedElementValue
}