使用@HTML.editor 生成SelectListItem 复选框？

Question

我是 ASP.NET MVC 的超级新手。我太新了，我仍然不善于措辞我的问题...我希望我能对此有所了解...

基本上，我想要的是一个复选框列表，其中包含数据库中的家具项目列表 table。 table 当前有 20 个条目；列是 ID 和名称。

我有多个表单，所以我一直在视图中使用这个：

<form method="post">
@foreach (var property in ViewData.ModelMetadata.Properties)
{
    <div class="form-group">
        <label asp-for="@property.PropertyName">
            @(property.DisplayName ?? property.PropertyName)
        </label>
        @Html.Editor(property.PropertyName)
        @Html.ValidationMessage(property.PropertyName, new { @class = "help-block" })
    </div>


}
<input type="submit" value="@ViewBag.Button" />
</form>

对于这种特殊形式，我在 ViewModel 中使用了这段代码（还有其他属性）：

    public List<SelectListItem> Furniture { get; set; }        

    public DeliveryViewModel(IEnumerable<Furniture> furniture)
    {
        Furniture = new List<SelectListItem>();

        foreach (Furniture piece in furniture)
        {
            Furniture.Add(new SelectListItem
            {
                Value = piece.ID.ToString(),
                Text = piece.Name
            });
        }
    }

    public DeliveryViewModel() {}

}
}

和控制器（是的，它叫做 Furnitures。我应该解决这个问题。）：

public IActionResult Delivery()
    {
        List<Furniture> furniture = context.Furnitures.ToList();
        return View("Index", new DeliveryViewModel(furniture));
    }

基本上，当我启动应用程序时，我得到的不是类似家具清单的任何东西，而是 table 中的每一项看起来像 "FalseFalseFalseFalseFalseFalse" 的东西。一开始我只是想得到一个下拉列表，但我什至无法得到它。

如果可以的话，我想继续使用 View 代码，因为我有多个表单使用该代码并且工作正常。那可能吗？似乎很多复选框列表的解决方案都涉及 @HTML.checkboxfor 或其某些变体，这会影响我重用此视图的能力。我在 ViewModel 中还有很多属性，我怀疑我在处理这个项目时需要做很多更改，因此为此制作一个特殊的表格会很烦人。

我说的有道理吗？我能得到帮助吗？

Answer 1

如果解决 "how do I build a list of items with checkboxes" 是您问题的核心关注点，那么上手起来就比较简单了。

我会为每个 "checkbox item":

定义一个视图模型

public class CheckBoxItem
{
    public int ID { get; set; }
    public string Name { get; set; }
    public bool IsChecked { get; set; }
}

SelectListItem 几乎相同，除了值属性是一个字符串 - 我建议的 CheckBoxItem class 让您可以直接使用它进行数据库查找（假设您的行 ID 是整数）。

在ASP.NET MVC框架中，如果你有一个与class同名的视图，你可以使用HtmlHelper.EditorFor方法自动拥有那个视图select编辑和渲染，像这样：

CheckBoxItem.cshtml

@model Fully.Qualified.Namespace.CheckBoxItem

<div class="checkbox-list-item>
    <div class="form-check">
        <label class="form-check-label">
            @Html.CheckBoxFor(m => m.IsChecked, new { @class="form-check-input" })
            @Model.Name
        </label
    </div>
    @Html.HiddenFor(m => m.ID)
    @Html.HiddenFor(m => m.Name)
</div>

然后，假设这是您的父视图：

Furniture.cshtml

@model Fully.Qualified.Namespace.FurnitureListModel

<div class="checkbox-list">
    @Html.EditorFor(m => m.Items)
</div>

以此为模特：

public class FurnitureListModel
{
    public ICollection<CheckBoxItem> Items { get; set; }
}

EditorFor 帮助程序将自动遍历集合属性、Items，呈现每个项目的视图。

提交表单时，您将检查每个项目的 IsChecked 属性（或使用 LINQ 到 select 所有为真的项目）以查看哪些项目被选中 - 复选框助手将为 true 和 false 构建输入，其中仅当复选框被选中时才提交 true 值。

使用@HTML.editor 生成SelectListItem 复选框？

Using @HTML.editor to generate SelectListItem checkboxes?

c#

asp.net-mvc

asp.net-mvc-4

CheckBoxItem.cshtml

Furniture.cshtml