如何将选定的项目ID从下拉列表传递给控制器​​的操作？

Question

一般问题概述:我有一个复合项的create\edit视图,我从下拉列表中为组件选择了很多选项.我希望能够添加或编辑在下拉列表中选择的特定组件.

这是一个简短但完整的例子:

假设我有一个Car模型

public class Car
{
    public int Id { get; set; }
    public string Name { get; set; }

    public BodyStyle BodyStyle { get; set; }
    public int BodyStyleId { get; set; }
}

BodyStyle是Car聚合的一个组成部分,定义如下:

public class BodyStyle
{
    public int Id { get; set; }
    public string Name { get; set; }
}

现在我有一个控制器动作来创建一辆汽车,

public ActionResult CreateCar()
{
    //BodyStyles is a mock property with all hardcoded BodyStyles, just for demo
    ViewBag.Styles = new SelectList(BodyStyles, "Id", "Name");
    return View();
}

以下是CreateCar视图的一部分,它定义了BodyStyle下拉列表.

<div class="form-group">
    @Html.LabelFor(model => model.BodyStyle, new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        @Html.DropDownListFor(model => model.BodyStyleId, (IEnumerable<SelectListItem>)ViewBag.Styles)
        @Html.ActionLink("Create", "CreateBodyStyle")

        @*here is the problem, can't find a way to pass selected BodyStyle Id to EditBodyStyle action*@
        @Html.ActionLink("Edit", "EditBodyStyle") 
    </div>
</div>

这是天真的实现 EditBodyStyle

public ActionResult EditBodyStyle(int bodyStyleId)
{
    return View(BodyStyles.First(b => b.Id == bodyStyleId));
}

有没有办法说ASP.NET MVC将选定的BodyStyle Id传递DropDownListFor给EditBodyStyleaction？

我用javascript实现了这一点,订阅onchange并存储了所选的值,然后在链接中使用它.但代码变得一团糟,因为我在几个视图中有近10个这样的组件.功能非常简单,所以我想知道我是否缺少一些ASP.NET MVC功能,这将帮助我只使用Razor视图引擎实现这一点.

以下是生成的视图,只是为了全面了解:

select标签的每个选项的格式是:

<option value="1">Coupe - 2 door</option>
<option value="2">Coupe - 3 door</option>

当前实现(上面的视图示例中没有id,但假设下拉列表和链接有id,如js中所述):

$(function () {
    $("#editBodyStyleLink").click(function () {
        var id = $("#bodyStylesDropDown").val();
        window.location.href = "/Home/EditBodyStyle/?id=" + id;
    });
});

Answer 1

首先，您需要将 bodyStyleId 作为参数发布（请注意，我使用 Cars 作为您的控制器名称，您需要将其更改为实际的控制器名称）：

   <div class="form-group">
@Html.LabelFor(model => model.BodyStyle, new { @class = "control-label col-md-2" })
<div class="col-md-10">
    @Html.DropDownListFor(model => model.BodyStyleId, (IEnumerable<SelectListItem>)ViewBag.Styles)
    @Html.ActionLink("Create", "CreateBodyStyle")

    @*here is the problem, can't find a way to pass selected BodyStyle Id to EditBodyStyle action*@
    @Html.ActionLink("Edit", "EditBodyStyle", null, new { bodyStyleId = model.BodyStyleId) 
</div>

然后，您需要在填充选择列表项时选择它并将其发送回视图：

public ActionResult EditBodyStyle(int bodyStyleId)
{
    var styles = BodyStyles.Select(m => new SelectListItem
                {
                    Value = m.Id.ToString(),
                    Text = m.Name,
                    Selected = bodyStyleId.Equals(m.Id.ToString())

                });
    ViewBag.Styles = styles;
    return View(model);
}

执行此操作时让我困惑的重要部分是选择列表的以下行：

 Selected = bodyStyleId.Equals(m.Id.ToString())

最后将其用于您的下拉列表。

@Html.DropDownListFor(model => model.BodyStyleId, (IEnumerable<SelectListItem>)ViewBag.Styles, "Please select")