asp.net-core - 从 ASP.NET Core 中的列表实现复选框列表

Question

我看过关于该主题的其他讨论帖，但我对我认为正确的语法/设置有疑问。最终， Controller 在从编辑返回时无法看到角色列表的内容。

查看

@model Models.Volunteer

            @foreach (var item in Model.Roles)
            {
                <input type="checkbox" asp-for="@item.Selected" />
                <label asp-for="@item.Selected">@item.RoleName</label>
                <input type="hidden" asp-for="@item.RoleId" />
                <input type="hidden" asp-for="@item.RoleName" />
                <br />
            }

<input type="submit" value="Save" class="btn btn-default" />

模型

public abstract class BaseVolunteer
{
    [Key]
    public int Recno { get; set; }
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public string Email { get; set; }
    public string City { get; set; }
    [NotMapped]
    [Display(Name = "Roles")]
    public List<Role> Roles { get; set; }
}

public class Role
{
    [Key]
    public String RoleId { get; set; }
    public String RoleName { get; set; }

    public bool Selected { get; set; }
}

Controller

    [HttpPost]
    [ValidateAntiForgeryToken]
    public async Task<IActionResult> Edit(int id, [Bind("Recno,FirstName,LastName,Email,City,Roles")] Volunteer volunteer)
    {
}

Controller 中的志愿对象正确返回其他值...但是 Roles 对象为 NULL，尽管已正确填充以供显示。

Answer 1

您需要使用数组索引器，以便模型绑定(bind)器知道每个项目的索引:

@for( Int32 i = 0; i < this.Model.Roles.Length; i++ ) {
    <input type="checkbox" asp-for="@Model.Roles[i].Selected" />
    <label asp-for="@Model.Roles[i].Selected">@Model.Roles[i].RoleName</label>
    <input type="hidden" asp-for="@Model.Roles[i].RoleId" />
    <input type="hidden" asp-for="@Model.Roles[i].RoleName" />
    <br />
} 

这将被渲染成这样:

    <input type="checkbox" name="Roles[0].Selected" value="false" id="Roles_0__Selected" />
    <label for="Roles_0__Selected">Admin</label>
    <input type="hidden" name="Roles[0].RoleId" value="10" />
    <input type="hidden" name="Roles[0].RoleName" value="Admin" />
    <br />

    <input type="checkbox" name="Roles[1].Selected" value="false" id="Roles_1__Selected" />
    <label for="Roles_1__Selected">Users</label>
    <input type="hidden" name="Roles[1].RoleId" value="120" />
    <input type="hidden" name="Roles[1].RoleName" value="Users" />
    <br />

    <input type="checkbox" name="Roles[2].Selected" value="false" id="Roles_2__Selected" />
    <label for="Roles_2__Selected">Guests</label>
    <input type="hidden" name="Roles[2].RoleId" value="123" />
    <input type="hidden" name="Roles[2].RoleName" value="Guestsd />
    <br />

注意 name="" 值如何包含模型绑定(bind)器可以使用的索引。