提交表单时复选框列表丢失

Question

我为员工及其角色提供了以下视图模型：

public class EmployeeViewModel
{
    public int Id { get; set; }
    // some more properties
    public List<EmployeeRoleViewModel> EmployeeRoles { get; set; }
}

public class EmployeeRoleViewModel
{
    public int Id { get; set; }
    public int EmployeeId { get; set; }
    public int RoleId { get; set; }
    public string Title { get; set; }
    public bool Selected { get; set; }
}

我在“编辑”视图中显示如下复选框：

@for (int i = 0; i < Model.EmployeeRoles.Count(); i++)
{
<label>
    <input type="checkbox" asp-for="@Model.EmployeeRoles[i].Selected" />
    @Model.EmployeeRoles[i].Title
</label>
}

这会为选中的复选框生成此HTML：

<input type="checkbox" checked="checked" 
    id="EmployeeRoles_0__Selected" 
    name="EmployeeRoles[0].Selected" value="true" />

...这是未经检查的：

<input type="checkbox" 
    id="EmployeeRoles_2__Selected" 
    name="EmployeeRoles[2].Selected" value="true" />

所有复选框均正确显示，所有右侧的复选框均带有复选标记。

该表单已发布到此控制器方法（为简便起见，已简化）：

[HttpPost]
public async Task<IActionResult> Edit(int id,[Bind("Id,EmployeeRoles")] Employee employee)
{
    db.Update(employee);
    await db.SaveChangesAsync();
    return RedirectToAction("Details", "Branches");
}

问题是employee.EmployeeRoles是长度为0的列表，即使选中了多个复选框也是如此。我在做什么错了？

Answer 1

name字段的input必须

name="Employee.EmployeeRoles[index].Selected"

为了将EmployeeRoles[index]绑定到EmployeeRoles对象内的Employee列表上。

Answer 2

请首先确认您在视图和动作功能中都使用了相同的视图模型。您可以添加隐藏的输入字段来帮助您绑定属性：

@for (int i = 0; i < Model.EmployeeRoles.Count(); i++)
{
    <label>
        <input type="checkbox" asp-for="@Model.EmployeeRoles[i].Selected" />
        @Model.EmployeeRoles[i].Title
    </label>

    <input type="hidden" asp-for="@Model.EmployeeRoles[i].Id" />
    <input type="hidden" asp-for="@Model.EmployeeRoles[i].Title" />
}

然后在controller上，您可以获得以下列表：

然后检查Selected属性，以确认是否选择了当前角色。