如何在 $.ajax() 中或之前强制表单客户端验证答案

【问题标题】：How to force form client-side validation in or before $.ajax()如何在 $.ajax() 中或之前强制表单客户端验证
【发布时间】：2015-11-03 04:36:56
【问题描述】：

我有一个表单并且启用了不显眼的验证。默认情况下，在提交方法中客户端验证被触发，并且（如果您有任何错误）表单如下所示：

验证甚至在任何数据发送到服务器之前发生。

现在，如果您想使用 $.ajax 方法，此行为将不起作用。客户端验证不起作用。您必须手动检查 javascript 中的所有字段，从而失去 DataAnnotations 的所有美感。

有没有更好的解决方案？我可以使用 jquery 的 submit()，但我猜它没有像 $.ajax 这样的回调。

【问题讨论】：

标签： validation asp.net-mvc-3 jquery unobtrusive-validation

【解决方案1】：

哦……

if (form.valid()) // do submit

【讨论】：

出于某种原因，我得到 .valid() is not a function 即使我的客户端验证工作正常 :( aghhh
@Yablargo 我也使用这种技术xhalent.wordpress.com/2011/01/24/…
最终解决了这个问题，这是由于无意中加载了 2 个不同的 jquery
哦，是的...我经历过

【解决方案2】：

在检查表单是否有效之前，您必须强制表单进行验证。像这样的：

var form = $( "#myform" );
form.validate();
if (form.valid()) {
    // ...
}

【讨论】：

【解决方案3】：

我做到了……

$("#form-submit-button").click(function (e) {
    e.preventDefault(); // Stops the form automatically submitting
    if ($("#my-form").valid()) {
        $("#my-form").submit();
    }
});

如果您说带有插件的文本框以使这些文本框成为日历控件，这似乎也是一个很好的解决方案。我这么说的唯一原因是因为我将 Zebra Datepicker 与 MVC 表单一起使用，如果焦点位于日历日期选择器上，它将提交无效表单。使用下面的代码可以停止这个。

【讨论】：

我遇到了一个完全不同的问题，但您的e.preventDefault(); 为我指明了正确的方向......以及$('#form').on('submit', function (e) { code });。

【解决方案4】：

我遇到了 Yablargo 的同样问题，因为它说 valid 不是一个函数，所以我想出了这个：

对于提交按钮的 onclick 处理程序，我是这样写的：

onclick="return $(this).closest('form').checkValidity();"

【讨论】：