ASP.NET Core Razor Pages中OnPostAsync()模型始终为空的问题

问题描述 #

在Razor Pages中，通过OnGet()从数据库加载数据到List<AllAircraftModels>并展示，复选框初始状态显示正确，但提交表单到OnPostAsync()时，绑定的listAircraftModels始终为空（count=0），无法获取修改后的复选框状态。

原因分析 #

使用foreach循环渲染列表时，生成的表单元素name属性不符合ASP.NET Core模型绑定规则。模型绑定器需要列表项的name属性包含索引（如listAircraftModels[0].isChecked）才能正确识别并绑定到List<T>类型的属性，而foreach循环无法生成这种格式的name。

解决方案 #

1. 修改视图（.cshtml）：改用for循环渲染列表 #

将foreach替换为for循环，同时添加隐藏字段提交记录的唯一标识（如Id），确保后端能匹配到对应记录：

@if (Model.listAircraftModels != null && Model.listAircraftModels.Any())
{
    <form method="post">
        <div class="container">
            <table class="table">
                <thead>
                    <tr>
                        <td>Active</td>
                        <td>Mfg</td>
                        <td>Make</td>
                        <td>Model</td>
                        <td>Size Category</td>
                    </tr>
                </thead>
                <tbody>
                    @for (int i = 0; i < Model.listAircraftModels.Count; i++)
                    {
                        <tr>
                            <td>
                                <!-- 提交唯一标识，用于后端匹配记录 -->
                                <input type="hidden" asp-for="listAircraftModels[i].Id" />
                                <input class="form-check-input" type="checkbox" asp-for="listAircraftModels[i].isChecked" />
                            </td>
                            <td>@Model.listAircraftModels[i].mfg</td>
                            <td>@Model.listAircraftModels[i].make</td>
                            <td>@Model.listAircraftModels[i].model</td>
                            <td>@Model.listAircraftModels[i].sizeCategory</td>
                        </tr>
                    }
                </tbody>
            </table>
            <input class="btn btn-dark me-2" type="submit" value="Submit" />
        </div>
    </form>
}
else
{
    <div class="container">
        <p>No aircraft models found!</p>
    </div>
}

2. 优化后端处理（.cshtml.cs）：增加模型验证与安全更新 #

在OnPostAsync()中添加模型验证，并采用“先获取原记录再更新”的方式，避免覆盖未提交的字段：

public async Task<IActionResult> OnPostAsync()
{
    // 模型验证失败时，重新加载数据并返回页面
    if (!ModelState.IsValid)
    {
        listAircraftModels = (await aircraftModelsRepository.GetAsync())?.ToList();
        return Page();
    }

    foreach (var submittedModel in listAircraftModels)
    {
        // 获取数据库中的原记录，避免直接更新提交的模型（防止未提交字段被清空）
        var existingModel = await aircraftModelsRepository.GetByIdAsync(submittedModel.Id);
        if (existingModel != null)
        {
            existingModel.isChecked = submittedModel.isChecked;
            await aircraftModelsRepository.UpdateAsync(existingModel);
        }
    }

    return RedirectToPage("/AircraftModel/Overview");
}

关键说明 #

• for循环生成的name属性带有索引，符合模型绑定规则，能让后端正确接收列表数据。
• 隐藏字段提交Id是为了确保后端能精准定位到需要更新的记录。
• 先获取原记录再更新，避免因表单仅提交部分字段而导致其他数据丢失。

内容的提问来源于stack exchange，提问作者confusedUser1