jQuery Validation插件:禁用指定提交按钮的验证

Question

我有一个包含多个字段的表单,我正在使用JörnZaeffere的优秀jQuery Validation插件验证(其中一些字段添加了用于自定义验证的方法).如何规避使用指定的提交控件进行验证(换句话说,使用一些提交输入进行激活验证,但不要与其他人一起激活验证)？这与使用标准ASP.NET验证器控件的ValidationGroup类似.

我的情况:

它与ASP.NET WebForms有关,但如果您愿意,可以忽略它.但是,我更多地使用验证作为"推荐":换句话说,当提交表单时,验证会触发,而不是显示"必需"消息,"推荐"会显示"你推荐"的内容错过了以下领域....你还想继续吗？" 在错误容器中的那一点,现​​在可以看到另一个提交按钮,可以按下该按钮,忽略验证并提交.如何规避此按钮控件的表单.validate()并仍然发布？

在http://jquery.bassistance.de/validate/demo/multipart/上购买和出售房屋样本允许这样做以便点击之前的链接,但它通过创建自定义方法并将其添加到验证器来实现.我宁愿不必创建自定义方法复制验证插件中已有的功能.

以下是我现在所获得的立即适用脚本的缩短版本:

var container = $("#<%= Form.ClientID %> div.validationSuggestion");

$('#<%= Form.ClientID %>').validate({          
    errorContainer: container,
    errorLabelContainer: $("ul",container),
    rules: {
        <%= YesNo.UniqueID %>: { required: true },
        <%= ShortText.UniqueID %>: { required: true } // etc.

    },
    messages: {
        <%= YesNo.UniqueID %>: 'A message.',
        <%= ShortText.UniqueID %>: 'Another message.' // etc.
    },
    highlight: function(element, errorClass) {
        $(element).addClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").addClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").removeClass("valid");
    },
    unhighlight: function(element, errorClass) {
        $(element).removeClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").removeClass(errorClass);
        $(element.form).find("label[for=" + element.id + "]").addClass("valid");
    },
    wrapper: 'li'
}); 

Answer 1

您可以cancel向提交按钮添加CSS类以禁止验证

例如

<input class="cancel" type="submit" value="Save" />

请参阅此功能的jQuery Validator文档:在提交时跳过验证

编辑:

上述技术已被弃用,并替换为该formnovalidate属性.

<input formnovalidate="formnovalidate" type="submit" value="Save" />

Answer 2

其他(无证)方式,就是打电话:

$("form").validate().cancelSubmit = true;

在按钮的单击事件上(例如).

Answer 3

又一种(动态)方式:

$("form").validate().settings.ignore = "*";

要重新启用它,我们只需设置默认值:

$("form").validate().settings.ignore = ":hidden";

资料来源:https://github.com/jzaefferer/jquery-validation/issues/725#issuecomment-17601443

Answer 4

添加formnovalidate属性到输入

    <input type="submit" name="go" value="Submit"> 
    <input type="submit" formnovalidate name="cancel" value="Cancel"> 

现在不推荐添加class ="cancel"

请参阅此链接上提交时跳过验证的文档

Answer 5

在连接验证时可以使用onsubmit:false选项(请参阅文档),该验证在提交表单时不会验证.然后在你的asp:按钮中添加一个OnClientClick = $('#aspnetForm').valid(); 明确检查表单是否有效.

您可以将此称为选择加入模型,而不是上述的选择退出.

注意,我也在使用ASP.NET WebForms进行jquery验证.有一些问题需要导航,但一旦通过它们,用户体验就非常好.