ASP.Net 核心 Razor 页面：<form class="needs-validation"> 如何实际调用客户端验证？

Question

我正在使用 ASP.Net Core 3.1 网络应用程序。

如果 Razor 页面有一个带有 class="needs-validation" 的表单，则会对该表单中的字段调用客户端验证。具体来说，当用户单击“提交”时调用 jquery-validation-unobtrusive。

问：这到底是怎么发生的？什么“魔力”将 HTML class“需要验证”链接到“validate()”Javascript 代码？某处是否有某个 CSS 文件定义了此链接？

问：“需求验证”是 Bootstrap class 吗？还是标准的HTML5/CSS3？ Where/how定义了吗？

这些是我找到的一些链接，但我仍然不明白 class“需要验证”调用验证代码之间的联系：

Answer 1

默认情况下，asp.net 核心应用程序使用 jQuery Unobtrusive Validation and https://jqueryvalidation.org/ 插件来实现客户端验证。 JQuery Unobtrusive Validation 解析数据属性并将逻辑传递给 jQuery Validation，有效地将 server-side 验证逻辑“复制”到客户端。您可以使用标签助手在客户端上显示验证错误，如下所示（没有 class="needs-validation"）：

    <form method="post">
        <div asp-validation-summary="ModelOnly" class="text-danger"></div>

        <div class="form-group">
            <label asp-for="Movie.Title" class="control-label"></label>
            <input asp-for="Movie.Title" class="form-control" />
            <span asp-validation-for="Movie.Title" class="text-danger"></span>
        </div>

        <div class="form-group">
            <label asp-for="Movie.Description" class="control-label"></label>
            <input asp-for="Movie.Description" class="form-control" />
            <span asp-validation-for="Movie.Description" class="text-danger"></span>
        </div>
        ....
        <div class="form-group">
            <input type="submit" value="Create" class="btn btn-primary" />
        </div>
    </form>

class="needs-validation"用于自定义Bootstrap表单验证消息（使用HTML5表单验证），然后，它会根据这个class选择器来查找元素并验证数据。查看 Bootstrap Validation 以了解其工作原理和使用方法。

ASP.Net 核心 Razor 页面：<form class="needs-validation"> 如何实际调用客户端验证？

ASP.Net Core Razor pages: how does <form class="needs-validation"> actually invoke client-side validation?

asp.net-core

razor

bootstrap-4

jquery-validate

unobtrusive-validation