如何清除jQuery验证错误消息？

Question

我正在使用jQuery验证插件进行客户端验证.editUser()单击"编辑用户"按钮调用该功能,该按钮显示错误消息.

但是我想在我的表单上清除错误消息,当我点击"清除"按钮时,它会调用一个单独的功能clearUser().

function clearUser() {
    // Need to clear previous errors here
}

function editUser(){
    var validator = $("#editUserForm").validate({
        rules: {
            userName: "required"
        },
        errorElement: "span",
        messages: {
            userName: errorMessages.E2
        }
    });

    if(validator.form()){
        // Form submission code
    }
}

Answer 1

你想要的resetForm()方法:

var validator = $("#myform").validate(
   ...
   ...
);

$(".cancel").click(function() {
    validator.resetForm();
});

我从他们的一个演示的源头抓住了它.

注意:此代码不适用于Bootstrap 3.

Answer 2

我自己遇到过这个问题.在根据步骤构建表单时,我需要有条件地验证表单的各个部分(即在运行时动态附加某些输入).因此,有时选择下拉列表需要验证,有时则不需要验证.但是,在考验结束时,需要进行验证.因此,我需要一种强大的方法,而不是一种解决方法.我咨询了源代码jquery.validate.

这是我想出的:

通过指示验证成功来清除错误

调用错误显示处理程序

清除所有成功或错误的存储

重置整个表单验证

这是代码中的样子:

function clearValidation(formElement){
 //Internal $.validator is exposed through $(form).validate()
 var validator = $(formElement).validate();
 //Iterate through named elements inside of the form, and mark them as error free
 $('[name]',formElement).each(function(){
   validator.successList.push(this);//mark as error free
   validator.showErrors();//remove error messages if present
 });
 validator.resetForm();//remove error class on name elements and clear history
 validator.reset();//remove all error and success data
}
//used
var myForm = document.getElementById("myFormId");
clearValidation(myForm);

缩小为jQuery扩展:

$.fn.clearValidation = function(){var v = $(this).validate();$('[name]',this).each(function(){v.successList.push(this);v.showErrors();});v.resetForm();v.reset();};
//used:
$("#formId").clearValidation();

Answer 3

如果您只想隐藏错误:

$("#clearButton").click(function() {
  $("label.error").hide();
  $(".error").removeClass("error");
});

如果您指定了errorClass,则调用该类隐藏error(默认)我在上面使用.

Answer 4

如果您之前没有将验证器与表单相关联,那么您也可以简单地调用它们

$("form").validate().resetForm();

因为.validate()将返回您之前附加的相同验证器(如果您这样做).

Answer 5

如果你想在不使用单独变量的情况下这样做

$("#myForm").data('validator').resetForm();

Answer 6

不幸的是,validator.resetForm()在许多情况下,它不起作用.

我有一个案例,如果有人在带有空白值的表单上点击"提交",它应该忽略"提交".没有错误.这很容易.如果有人输入部分值,并点击"提交",则应标记某些字段有错误.但是,如果他们消除了这些值并再次点击"提交",则应清除错误.在这种情况下,由于某种原因,验证器中的"currentElements"数组中没有元素,因此执行.resetForm()绝对没有任何内容.

这上面有bug.

在他们修复它们之前,你需要使用Nick Craver的答案,而不是Parrots接受的答案.

Answer 7

您可以使用:

$("#myform").data('validator').resetForm();

Answer 8

我想我们只需要输入输入来清理所有东西

$("#your_div").click(function() {
  $(".error").html('');
  $(".error").removeClass("error");
});

Answer 9

如果您只想清除验证标签,可以使用jquery.validate.js中的代码resetForm()

var validator = $('#Form').validate();

validator.submitted = {};
validator.prepareForm();
validator.hideErrors();
validator.elements().removeClass(validatorObject.settings.errorClass);