Bootstrap 5 验证不适用于 .NET 8 ASP.NET Core

Question

我正在尝试对应用程序中的错误消息使用 Bootstrap 5 样式。在之前的项目中，如果由于模型中不满足所需属性而导致验证失败，输入字段将具有红色边框和警告三角形。 但是，在我当前的项目中，我无法让它工作，验证消息根本不会出现在 div 内。我在 ModelState 中设置的错误消息也不会出现。但是，如果我将 @Html.ValidationMessageFor 移到无效反馈 div 之外，它会按应有的方式显示，但文本或关联的输入字段上没有样式。根据我的理解，这是因为当从模型收到错误时，输入字段没有添加“is-invalid”类。是否可以在不使用 JavaScript 的情况下将 is-invalid 类自动添加到输入字段？这是我的代码：

查看

@model TestProject.Models.TestModel

@using (Html.BeginForm())
{
    <div>
        <form class="row g-3">
            <div class="col-md-4">
                <label for="name" class="form-label">Name</label>
                    @Html.TextBoxFor(m => m.Name, new { @class = "form-control", id = "name", required = "required" })
                <div class="invalid-feedback" id="validationFeedback">
                    @Html.ValidationMessageFor(m => m.Name)
                    Error should appear here
                </div>
            </div>
            <div class="col-md-4">
                <button type="submit" class="btn btn-primary">Submit</button>
            </div>
        </form>
    </div>
}

型号

public class TestModel
{
    [Required(ErrorMessage = "Name is required")]       
    public string Name { get; set; } = "";
}

控制器

public class TestController : Controller
{
    public IActionResult Index(TestModel model)
    {
        if(model.Name == "Error")
        {
            ModelState.AddModelError("Name", "Error occured");
        }

        if(!ModelState.IsValid)
        {
            // Do something.
            return View(model);
        }

        return View(model);
    }
}

我已确保我的布局文件中使用了正确的脚本：

<script src="~/lib/jquery-validation/dist/jquery.validate.min.js"></script>
<script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>

我之前参与的一个项目拥有庞大的代码库并在 .NET 2.0 上运行，其形式采用我提供的结构。我找不到任何全局 JavaScript 或类似的东西，可以在该项目中“手动”设置输入或任何其他样式的 is-invalid 类。它在那个旧项目中以某种方式神奇地工作，我想知道这是否可以在我当前的项目中做到？

Answer 1

您可以使用显示类手动显示

class="invalid-feedback

，例如：

 d-block

这里有一个例子你可以参考：

<div class="invalid-feedback d-block">
     @Html.ValidationMessageFor(m => m.Name)
                   
 </div>