ASP.NET Core Razor Pages中使用AddRange批量插入多行失败求解决

尝试提交表单插入多条数据行，但没有任何数据被保存，无法定位原因，以下是相关代码：

前端代码 #

// Here the rows are inserted 
<form method="post">
        <div asp-validation-summary="ModelOnly" class="text-danger"></div>
        @{
            int i = 0;
        }
        @foreach (var item in Model.RowList)
        {
            <div class="row">
                <div class="form-group col-4">
                    <input asp-for="@Model.RowList[i].Name" class="form-control" value="@item.Name" />
                    <span asp-validation-for="@Model.RowList[i].Name" class="text-danger"></span>
                </div>
                <div class="form-group col-4">
                    <input asp-for="@Model.RowList[i].Qty" class="form-control" value="@item.Qty" />
                    <span asp-validation-for="@Model.RowList[i].Qty" class="text-danger"></span>
                </div>
                <div class="form-group col-4">
                    <input asp-for="@Model.RowList[i].Price" class="form-control" value="@item.Price" />
                    <span asp-validation-for="@Model.RowList[i].Price" class="text-danger"></span>
                </div>
            </div>
            @(i++)
        }
        <div class="form-group">
            <input type="submit" value="Create" class="btn btn-primary" />
            <a asp-page="Index">Back to List</a>
        </div>
    </form>

后端代码 #

[BindProperty]
    public InvRow InvRow { get; set; }
    public IList<InvRow> RowList { get; set; }

    public IActionResult OnGetAsync()
    {
        var rr = new List<InvRow>()
        {
             new InvRow() { Name = "Apple", Qty = 1, Price = 100 },
             new InvRow() { Name = "Peach", Qty = 1, Price = 500 },
             new InvRow() { Name = "Ananas", Qty = 1, Price = 1100 },
        };

        RowList = rr;

        return Page();
    }

    public async Task<IActionResult> OnPostAsync(IList<InvRow> rw)
    {
        if (!ModelState.IsValid)
        {
            return Page();
        }

        _context.InvRows.AddRange(rw);

        await _context.SaveChangesAsync();

        return RedirectToPage("./Index");
    }

解决方法 #

问题核心在于模型绑定配置错误和提交参数接收逻辑问题，具体修正步骤：

1. 给RowList添加[BindProperty]属性
   ASP.NET Core中，只有标记了[BindProperty]的类属性才会自动进行表单模型绑定，原代码里RowList未标记该属性，导致提交的数据无法被绑定到该变量。修改后：

   [BindProperty]
   public IList<InvRow> RowList { get; set; }
   

2. 调整OnPostAsync方法的参数与逻辑
   无需额外接收IList<InvRow> rw参数，直接使用类中已绑定的RowList即可，同时增加空值判断避免异常：

   public async Task<IActionResult> OnPostAsync()
   {
       if (!ModelState.IsValid || RowList == null || !RowList.Any())
       {
           return Page();
       }
   
       _context.InvRows.AddRange(RowList);
       await _context.SaveChangesAsync();
   
       return RedirectToPage("./Index");
   }
   

3. （可选）优化前端循环写法
   用for循环替代foreach，无需手动维护索引i，且asp-for会自动填充模型值，无需手动设置value：

   @for (int i = 0; i < Model.RowList.Count; i++)
   {
       <div class="row">
           <div class="form-group col-4">
               <input asp-for="RowList[i].Name" class="form-control" />
               <span asp-validation-for="RowList[i].Name" class="text-danger"></span>
           </div>
           <div class="form-group col-4">
               <input asp-for="RowList[i].Qty" class="form-control" />
               <span asp-validation-for="RowList[i].Qty" class="text-danger"></span>
           </div>
           <div class="form-group col-4">
               <input asp-for="RowList[i].Price" class="form-control" />
               <span asp-validation-for="RowList[i].Price" class="text-danger"></span>
           </div>
       </div>
   }
   

完成以上修改后，表单提交的多条数据即可正确绑定并保存到数据库。

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