ASP.NET Core 5 - 具有动态字段数的表单答案

【问题标题】：ASP.NET Core 5 - Forms with dynamic number of fieldsASP.NET Core 5 - 具有动态字段数的表单
【发布时间】：2021-03-24 17:08:13
【问题描述】：

我在 ASP.NET Core 5 中做一个网页项目，我遇到了以下问题。我的模型是这样的

  public class Performance
    {
        public int ID { get; set; }
        public string Title { get; set; }
        public string Dates { get; set; }
        public bool DatesRange { get; set; }
        public string Author { get; set; }
        public string Role { get; set; }
        public Venue Venue { get; set; }

    }

现在，在表单中，我想为性能模型的所有字段提供输入字段，除了日期。这个想法是，单个表演可以有一个或多个日期，因此用户可以在创建新表演时在表单中添加任意数量的额外行。

我想做但不知道如何手动处理提交数据的绑定，因此我可以解析所有提交的日期并将它们转换为单个字符串以保存在数据库中。不过，我不确定如何，或者更确切地说，在哪里 这样做，因为点击提交按钮后触发的第一件事就是这个

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

            _context.Performance.Add(Performance);
            await _context.SaveChangesAsync();

            return RedirectToPage("./Index");
        }

并且提交的数据已经绑定到模型上。任何与模型不对应的表单字段都将被忽略。你能指出我正确的方向吗？

【问题讨论】：

您是否尝试过添加多个名称为date 的字段？如果你这样做了，我相信模型绑定器会将它们绑定为一个逗号分隔的列表。所以如果你有例如?date=2020-12-24&date=1820-12-10 那么您的Dates 字段应该以2020-12-24,1820-12-10 的值结束。也就是说，这里的教科书解决方案是将Dates 设为一个集合，然后根据the collection conventions 命名您的字段。
作为替代方案，您始终可以在调用ModelState.IsValid 之前执行一些手动绑定，方法是使用Controller.Request 属性自己提取值，然后手动将它们设置为您的模型。这是一种无需实现自定义模型绑定器即可处理一次性模型绑定异常的快速简便方法。

标签： c# asp.net asp.net-core asp.net-core-5.0

【解决方案1】：

您可以使用asp-page-handler 从剃刀页面的内部表单发出另一个请求。此外，您需要将日期定义为 List<string> 您的 Performance 模型看起来像

在您的剃须刀页面中，您需要设置多个帖子

<form method="post">
<input asp-for="perf.Date" value="Date" />
<button asp-page-handler="Date">Add</button>
<table>
    <th>
        <td>Date</td>
    </th>
    @if (Model.Dates != null)
    {
        for (int i = 0; i < Model.Dates.Count; i++)
        {
            <tr>
                <td>@Model.Dates[i] @Html.HiddenFor(model => Model.Dates[i])</td>
            </tr>
        }
    }
   
    
</table>
<input type="submit" value="Save"/>

cshtml.cs 文件将跟随签名。 OnPostDate 将处理单独的帖子以添加日期。 'OnPost' 将处理完整的模型发布。

  [BindProperty] public Performance perf { get; set; }
    [BindProperty] public List<string> Dates { get; set; }
    public void OnGet()
    {
        perf = new Performance();
    }

    public void OnPost()
    {
        if (!ModelState.IsValid)
        {
            return Page();
        }
        foreach (string dt in Dates)
        {    
            perf.Date = dt;
            _context.Performance.Add(Performance);
        }
        await _context.SaveChangesAsync();
        return RedirectToPage("./Index");       
    }
    public IActionResult OnPostDate()
    {
        if (Dates.Count == 0)
        {
            Dates = new List<string>();
            Dates.Add(perf.Date);
        }
        else
        {
            Dates.Add(perf.Date);
        }

        
        return Page();
    }

输出：

【讨论】：