如何正确提交复选框值到 ASP.NET MVC 中的控制器

Question

我正在开发 ASP.NET MVC Web 应用程序，我需要使用 checkboxs 将 List<ProdColor> 提交给 Controller。这是我的代码

型号

public partial class ProdColor
{
    public int ProdColor_ID { get; set; }
    public Nullable<int> P_ID { get; set; }
    public Nullable<int> Color_ID { get; set; }

    public virtual ProdctModelView ProdctModelView { get; set; }
}

public class ProdctModelView
{
    public ProdctModelView()
    {
        this.ProductColors = new HashSet<ProdColor>();
    }

    public int P_ID { get; set; }
    public string P_name { get; set; }

    public virtual ICollection<ProdColor> ProductColors { get; set; }
}

控制器

public ActionResult Create()
{
    ViewBag.colorlist = db.Colors.OrderBy(m => m.Color_name).ToList();
    return View();
}

[HttpPost]
public ActionResult Create(ProdctModelView product, List<ProdColor> ProductColors)
{
    Product prod = new Product();
    //Save new product
    db.Products.Add(prod);
    db.SaveChanges();

    foreach (var color in ProductColors)
    {        
        color.P_ID = prod.P_ID;
        db.ProdColors.Add(color);
     }
     db.SaveChanges();
     return RedirectToAction("Index");
}

查看

@model mvc4test.Models.ProdctModelView
@using (Html.BeginForm("Create", "CP_Product", FormMethod.Post))
{

    @for (int i = 0; i < ViewBag.colorlist.Count; i++)
    {                      
        <input type="checkbox" id="@ViewBag.colorlist[i].Color_name" name="[@i].Color_ID" value="@ViewBag.colorlist[i].Color_id"/>
    }
    <input type="submit" value="Save" />
}

问题是当提交复选框而不选择第一个时，List<ProdColor> 的值变为Null。那么我应该如何在Controller 获得正确的值。

Answer 1

您使用索引器手动创建复选框。未选中的复选框不会回传值，因此如果未选中任何复选框，则会获得不连续的索引器，因此模型绑定失败。

您的模型（视图模型）需要包含一个boolean 属性（例如）public bool IsSelected { get; set; }，以便在视图中您可以使用@Html.CheckBoxFor() 方法强绑定到您的模型。

@for (int i = 0; i < Model.ColorList.Count; i++)
{
    @Html.HiddenFor(m => m.ColorList[i].Color_id)
    @Html.CheckBoxFor(m => m.ColorList[i].IsSelected)
    @Html.LabelFor(m => m.ColorList[i].IsSelected, Model.ColorList[i].Color_name)
}

CheckBoxFor() 方法生成一个带有value="true" 的复选框和一个带有value="false" 的关联隐藏输入。如果选中该复选框，则true 和false 都会发布，但仅绑定第一个 (true) 值。如果未选中该复选框，则发布唯一的false。

然后在 POST 方法中，您可以使用 (say) 获取所选项目的 ID

var selectedColors = product.ColorList.Where(c => c.IsSelected).Select(c => c.Color_id);

请注意，List<ProdColor> ProductColors 的 POST 方法中不需要参数，因为参数 ProdctModelView product 已经包含所有这些值。