ASP.Net Core 客户端验证：是否有“验证成功”DOM 事件？

问题描述

我有一个使用 Bootstrap 并进行客户端验证的 ASP.Net Core Razor 页面。

表格如下所示：

<form method="post" class="needs-validation" novalidate>
...

_ValidationScriptsPartial.cshtml 看起来像这样：

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

一切正常。如果用户未能输入必填字段或输入的数字超过最大值，则表单将不会提交，且违规字段会以红色突出显示。

问：是否有“验证成功”触发的 DOM 事件？

我想在我知道表单“OK”之后执行一些 Javascript，但在它实际发布到服务器之前。

先谢谢你！

解决方法

如果您想要一个快速交钥匙解决方案，您只需包含 * Exception is: org.gradle.api.plugins.UnknownPluginException: Plugin [id: 'test.resource-plugin',version: '1.0-SNAPSHOT'] was not found in any of the following sources: - Gradle Core Plugins (plugin is not in 'org.gradle' namespace) - Plugin Repositories (could not resolve plugin artifact 'test-starter-plugin:test-starter-plugin.gradle.plugin:1.0-SNAPSHOT') 。 valid 条件仅在其有效时才返回 true。

答案：然后您可以通过发送 jQuery Validation Plugin 或 rxJs-subscribe 来data structure 到它以使用此 jquery.observable 插件获取事件

以下是 Jquery Valid 的工作原理：

表格：

---

control

---

控制：

$("form").valid(); 
// or
if($("form").valid()) {
 //VALID continue
}

---

On Submit：您也可以通过检查表单提交获得与有效事件类似的结果

$("[name='CountyOfBirth']").valid(); // RETURNS true/false

,

您可以在剃刀视图中的表单中使用 jQuery Unobtrusive Ajax。

首先，您需要包含 jQuery Unobtrusive Ajax 脚本：

npm i jquery-ajax-unobtrusive -D  (or --save-dev)

其次，您需要通过添加特定的自定义 data- 属性在表单上启用不显眼的 ajax：

<form method="post" class="needs-validation" novalidate
  data-ajax="true" data-ajax-method="post"
  data-ajax-begin="onFormBegin"
  data-ajax-complete="onFormComplete">

您可以使用 other attributes。

您可以在这里注册回调，例如在表单提交的开始和完成时：

@section scripts {
    <script type="text/javascript">
        $(function() {
            window.onFormBegin = function() {
                // This is the place where you can execute some Javascript 
                // after you know the form is "OK",but before it's actually 
                // POSTED to the server.
            };

            window.onFormComplete = function(request,status) {
                // ...
            };
        });
    </script>
}