使用IEnumerable模型时如何在字段旁显示模型验证错误信息？

在同一个视图中同时展示数据列表，并通过[HttpPost]方法创建新条目。当模型验证不通过时，ValidationSummary能正常提示expenseName为必填项，但使用IEnumerable作为视图模型后，asp-validation-for标签失效，无法在对应字段（如expenseName）旁显示错误信息，如何解决？

现有模型代码 #

[Key]
public int expenseId { get; set; }
[Column(TypeName = "nvarchar(50)")]
[Required(ErrorMessage = "The field 'Expense Name' is required")]
public string expenseName { get; set;}
public double price { get; set; }
public bool isStandard { get; set; }
public DateTime? date { get; set; }

现有视图代码 #

@model IEnumerable<ExpenseTracker.Models.Expenses>
@Html.ValidationSummary(false, "", new { @class = "text-danger" })
@{
    ViewData["Title"] = "Index";
}

<form method="post" enctype="multipart/form-data" asp-controller="Expenses" asp-action="Index">
    <div>
        <label for="files" class="lbl-select-file">Select Expense File</label>
        <input id="files" name="postedFiles" class="btn-uploader" type="file">
    </div>
    <label class="expense-name-lbl" for="expenseName">Expense Name</label>
    <input type="text" name="expenseName" class="expense-name-input" id="expenseName" />
    <span asp-validation-for="  " class="text-danger"></span>
    <div class="form-group form-check">
        <label class="form-check-label checkbox-isStandard-form">
            <input class="form-check-input" type="checkbox" name="chkeco" title="Check this if the bill is monthly/yearly" /> Is Standard?
        </label>
    </div>
    <input type="submit" class="btn btn-success btnColor-expenses" value="Upload" />
    <label id="fileName"></label>
    <span class="uploaded-file">@Html.Raw(ViewBag.Message)</span>
</form>

<table class="table table-text">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.expenseName)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.price)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.isStandard)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.date)
            </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.expenseName)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.price)
                </td>
                <td>
                    <input type="checkbox" class="checkbox-isStandard" checked="@item.isStandard" />
                </td>
                <td>
                    @if (item.date.HasValue)
                    {
                        DateTime? datetimeToDate = @item.date;
                        string FormattedDate = datetimeToDate.Value.ToString("dd-MM-yyyy");
                        <label>@FormattedDate</label>
                    }
                </td>
                <td>
                    <a asp-action="Edit" asp-route-id="@item.expenseId">Edit</a> |
                    <a asp-action="Details" asp-route-id="@item.expenseId">Details</a> |
                    <a asp-action="Delete" asp-route-id="@item.expenseId">Delete</a>
                </td>
            </tr>
        }
    </tbody>
</table>

现有控制器代码 #

[HttpPost]
[ValidateAntiForgeryToken]
[PreventDuplicateRequest]
public async Task<IActionResult> Index(IFormCollection formCollection, string expenseName, 
    List<IFormFile> postedFiles, [Bind("expenseName,price,isStandard,date")] Expenses expenses)
{
    if (ModelState.IsValid)
    {
        // 原有新增逻辑
        return View(await _context.Expenses.ToListAsync());
    }
    else
    {
        return View(await _context.Expenses.ToListAsync());
    }
}

核心问题：视图模型是IEnumerable<Expenses>（列表集合），但表单绑定的是单个Expenses对象，asp-validation-for无法从集合模型中找到单个实体的属性。以下是两种解决方式：

方案1：使用ViewModel包装列表与新增实体（推荐） #

这种方式符合MVC设计原则，职责清晰，便于后续扩展。

步骤1：创建ViewModel #

public class ExpenseIndexViewModel
{
    // 用于新增的费用实体
    public Expenses NewExpense { get; set; }
    // 已有的费用列表
    public IEnumerable<Expenses> ExpenseList { get; set; }
}

步骤2：修改控制器代码 #

// GET请求：返回包装好的ViewModel
public async Task<IActionResult> Index()
{
    var viewModel = new ExpenseIndexViewModel
    {
        ExpenseList = await _context.Expenses.ToListAsync(),
        NewExpense = new Expenses() // 初始化新增实体，避免空引用
    };
    return View(viewModel);
}

// POST请求：接收ViewModel并处理验证
[HttpPost]
[ValidateAntiForgeryToken]
[PreventDuplicateRequest]
public async Task<IActionResult> Index(ExpenseIndexViewModel viewModel, List<IFormFile> postedFiles)
{
    if (ModelState.IsValid)
    {
        // 执行新增逻辑
        _context.Add(viewModel.NewExpense);
        await _context.SaveChangesAsync();
        
        // 重新加载列表数据，重置新增实体清空表单
        viewModel.ExpenseList = await _context.Expenses.ToListAsync();
        viewModel.NewExpense = new Expenses();
        return View(viewModel);
    }
    else
    {
        // 验证失败时重新加载列表数据
        viewModel.ExpenseList = await _context.Expenses.ToListAsync();
        return View(viewModel);
    }
}

步骤3：修改视图代码 #

@model ExpenseTracker.Models.ExpenseIndexViewModel
@Html.ValidationSummary(false, "", new { @class = "text-danger" })
@{
    ViewData["Title"] = "Index";
}

<form method="post" enctype="multipart/form-data" asp-controller="Expenses" asp-action="Index">
    <div>
        <label for="files" class="lbl-select-file">Select Expense File</label>
        <input id="files" name="postedFiles" class="btn-uploader" type="file">
    </div>
    <label class="expense-name-lbl" for="expenseName">Expense Name</label>
    <!-- 绑定到ViewModel中的NewExpense实体 -->
    <input type="text" asp-for="NewExpense.expenseName" class="expense-name-input" />
    <!-- 显示对应字段的错误信息 -->
    <span asp-validation-for="NewExpense.expenseName" class="text-danger"></span>
    
    <div class="form-group form-check">
        <label class="form-check-label checkbox-isStandard-form">
            <input class="form-check-input" asp-for="NewExpense.isStandard" title="Check this if the bill is monthly/yearly" /> Is Standard?
        </label>
    </div>
    <input type="submit" class="btn btn-success btnColor-expenses" value="Upload" />
    <label id="fileName"></label>
    <span class="uploaded-file">@Html.Raw(ViewBag.Message)</span>
</form>

<table class="table table-text">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.ExpenseList.First().expenseName)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ExpenseList.First().price)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ExpenseList.First().isStandard)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ExpenseList.First().date)
            </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model.ExpenseList)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.expenseName)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.price)
                </td>
                <td>
                    <input type="checkbox" class="checkbox-isStandard" checked="@item.isStandard" />
                </td>
                <td>
                    @if (item.date.HasValue)
                    {
                        string FormattedDate = item.date.Value.ToString("dd-MM-yyyy");
                        <label>@FormattedDate</label>
                    }
                </td>
                <td>
                    <a asp-action="Edit" asp-route-id="@item.expenseId">Edit</a> |
                    <a asp-action="Details" asp-route-id="@item.expenseId">Details</a> |
                    <a asp-action="Delete" asp-route-id="@item.expenseId">Delete</a>
                </td>
            </tr>
        }
    </tbody>
</table>

方案2：手动映射ModelState错误（临时修复） #

如果不想创建ViewModel，可以手动将验证错误从Expenses实体转移到顶级ModelState，匹配表单字段名称：

修改控制器代码 #

[HttpPost]
[ValidateAntiForgeryToken]
[PreventDuplicateRequest]
public async Task<IActionResult> Index(IFormCollection formCollection, string expenseName, 
    List<IFormFile> postedFiles, [Bind("expenseName,price,isStandard,date")] Expenses expenses)
{
    if (ModelState.IsValid)
    {
        // 原有新增逻辑
        return View(await _context.Expenses.ToListAsync());
    }
    else
    {
        // 将Expenses实体的错误转移到顶级，匹配表单的name属性
        foreach (var key in ModelState.Keys.Where(k => k.StartsWith("expenses.")))
        {
            var newKey = key.Replace("expenses.", "");
            ModelState.AddModelError(newKey, ModelState[key].Errors.First().ErrorMessage);
            ModelState.Remove(key);
        }
        return View(await _context.Expenses.ToListAsync());
    }
}

修改视图代码 #

<!-- 直接指定字段名称 -->
<span asp-validation-for="expenseName" class="text-danger"></span>

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