c# - 将选定值的集合从 Select2-Multi DropDownList 传递到 Controller

Question

所以我正在编写一个 Select2 的示例以在项目中使用，但我遗漏了一部分。我不确定所选的下拉列表集合将如何返回 Controller 。我尝试了 Automobiles 和 SoldAutomobiles 的几种组合，当我中断提交操作方法时， Controller 始终不显示任何数据。

查看

@model Select2Demo.Models.Auto.Dealership

@{
    ViewBag.Title = "Auto Home Page";
}
<script src="~/Scripts/jquery-2.1.0.js"></script>
<script src="~/Scripts/select2.js"></script>
<link href="~/Content/css/select2.css" type="text/css" rel="stylesheet" />
<!-- <link href="~/Content/css/select2-1.css" type="text/css" rel="stylesheet" />-->
<link href="~/Content/bootstrap.css" type="text/css" rel="stylesheet" />
<link href="~/Content/select2-bootstrap.css" type="text/css" rel="stylesheet" />

<script>
    $(document).ready(function () {
        $("#ddlCars").select2({
            placeholder: "Select a Cars.."
        });

        $("#ddlCarsCustom").select2({
            placeholder: "Select a Cars.."
        });
    });
</script>

<div class="jumbotron">
    <h1>Select2 Multi-Select Example</h1>
</div>

@using (Html.BeginForm("Submit", "Auto"))
{
    <div class="container">
        <div class="row">
            <div class="col-md-4 form-group">
                <div class="editor-label">
                    @Html.LabelFor(model => model.Automobiles)
                </div>
                <div class="editor-field">
                    @Html.DropDownListFor(model => model.Automobiles, new SelectList(Model.Automobiles, "Id", "Make", Model.SoldAutomobiles), new { multiple = "multiple", @id = "ddlCars" })
                </div>
            </div>
        </div>

        <div class="col-sm-1">
            <input type="submit" value="Submit" class="btn btn-primary btn-lg submit-btn"/>
        </div>

    </div>
}

Controller

public class AutoController : Controller
{
    public ActionResult Index()
    {
        List<Automobile> autos  = new List<Automobile>();
        Automobile auto = GetAuto(1,"Chevy");
        autos.Add(auto);
        auto = GetAuto(2, "Ford");
        autos.Add(auto);
        auto = GetAuto(3, "Audi");
        autos.Add(auto);
        auto = GetAuto(4, "Toyota");
        autos.Add(auto);
        auto = GetAuto(5, "Duster");
        autos.Add(auto);
        auto = GetAuto(6, "Esteem");
        autos.Add(auto);
        auto = GetAuto(7, "Fiero");
        autos.Add(auto);
        auto = GetAuto(8, "Lancer");
        autos.Add(auto);
        auto = GetAuto(9, "Phantom");
        autos.Add(auto);

        Dealership dealership = new Dealership {Automobiles = autos};
        return View(dealership);
    }

    public ActionResult Submit(Dealership dealer)
    {
        Dealership dealership = new Dealership {SoldAutomobiles = dealer.SoldAutomobiles};

        return View("Index", dealership);
    }



    private static Automobile GetAuto(int id, string make)
    {
        return new Automobile {Id = id, Make = make};
    }
}

类

public class Automobile
{
    public int Id { get; set; }
    [Display(Name = "Make")]
    public string Make { get; set; }
}

public class Dealership
{
    public List<Automobile> Automobiles { get; set; }
    public List<Automobile> SoldAutomobiles { get; set; } 
}

随着工作代码更改而更新。

查看

@model Select2Demo.Models.Auto.Dealership

@{
    ViewBag.Title = "Auto Home Page";
}


<script>
    $(document).ready(function () {
        $("#ddlCars").select2({
            placeholder: "Select a Cars.."
        });
    });
</script>

<div class="jumbotron">
    <h1>Select2 Multi-Select Example</h1>
</div>

@using (Html.BeginForm("Submit", "Auto"))
{
    <div class="container">
        <div class="row">
            <div class="col-md-4 form-group">
                <div class="editor-label">
                    @Html.LabelFor(model => model.Automobiles)
                </div>
                <div class="editor-field">
                    @Html.ListBoxFor(model => model.SelectedAutomobiles, new SelectList(Model.Automobiles, "Id", "Make"), new { multiple = "multiple", @id = "ddlCars" })
                </div>
            </div>
        </div>

        <div class="col-sm-1">
            <input type="submit" value="Submit" class="btn btn-primary btn-lg submit-btn"/>
        </div>

    </div>
}

模型

public class Automobile
{
    public int Id { get; set; }
    [Display(Name = "Make")]
    public string Make { get; set; }
}

public class Dealership
{
    [Display(Name = "Available Auto Makes")]
    public List<Automobile> Automobiles { get; set; }
    public int[] SelectedAutomobiles { get; set; } 
}

Answer 1

您需要一个有效的属性来绑定(bind)(目前您正在尝试绑定(bind)一个 <select>，它将所选选项值的简单数组回传到复杂对象的集合)

public class Dealership
{
  public int[] SelectedCars { get; set; }
  public List<Automobile> Automobiles { get; set; }
}

在 View 中

@Html.ListBoxFor(m => m.SelectedCars, new SelectList(Model.Automobiles, "Id", "Make"))

注意 SelectedCars 的值是否匹配选项的任何值，然后在呈现页面时将在 View 中选择这些选项(例如，如果 model.SelectedCars = new int[] { 2, 6 }; 则将选择“Ford”和“Esteem”。