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

Question

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

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

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

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

Answer 1

哦...

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

Answer 2

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

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

Answer 3

我做了...

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

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

Answer 4

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

对于提交按钮的 onclick 处理程序，我把这个：

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