c# - 如何绑定html选择选项中的值？

Question

我需要绑定 html 选择选项中的值，并且我在 C# 模型中有值。我该怎么做呢？我的html代码：

 <div class="Div"><span class="label2">values:</span>
    <select id="Binding_values" onchange="values()></select></div>

Answer 1

假设您有一个视图模型：

public class MyViewModel
{
    public string SelectedValue { get; set; }
    public IEnumerable<SelectListItem> Items { get; set; }
}

和一个控制器动作，它将填充这个视图模型并将其传递给视图：

public ActionResult Index()
{
    var model = new MyViewModel();
    model.Items = new[]
    {
        // TODO: those values could come from a database for example
        new SelectListItem { Value = "1", Text = "item 1" },
        new SelectListItem { Value = "2", Text = "item 2" },
        new SelectListItem { Value = "3", Text = "item 3" },
    };
    return View(model);
}

在相应的强类型视图中，您可以使用DropDownListFor帮助器：

@model MyViewModel
...
@using (Html.BeginForm())
{
    @Html.DropDownListFor(x => x.SelectedValue, Model.Items)
    <button type="submit">OK</button>
}

如果此下拉列表位于用于回发到控制器的 HTML 中，则您可以执行一个操作来从模型中检索选定的值：

[HttpPost]
public ActionResult Index(MyViewModel model)
{
    // model.SelectedValue will contain the selected value from the dropdown list here
    ...
}

假设您想在更改下拉列表中的选择后立即将选定的值发送到服务器而不单击表单提交按钮，您可以为此 DropDownList 提供一个唯一的 id：

@Html.DropDownListFor(x => x.SelectedValue, Model.Items, new { id = "myDdl" })

然后.change()使用 jQuery 订阅此下拉列表的事件并提交包含表单：

$(function() {
    $('#myDdl').change(function() {
        $(this).closest('form').submit();
    });
});