Как очистить сообщения об ошибках проверки jQuery?

Я использую плагин проверки 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
    }
}

ОТВЕТЫ

Ответ 1

Вам нужен метод resetForm():

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

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

Я схватил его из источника одного из своих демонстраций.

Примечание. Этот код не будет работать для Bootstrap 3.

Ответ 2

Я сам столкнулся с этой проблемой. У меня возникла необходимость условно проверить части формы, пока форма была построена на основе этапов (т.е. Некоторые входы были динамически добавлены во время выполнения). В результате иногда выпадающее меню select должно требовать проверки, а иногда и нет. Однако к концу испытания он должен быть проверен. В результате мне понадобился надежный метод, который не был обходным путем. Я прочитал исходный код для jquery.validate.

Вот что я придумал:

Очистить ошибки, указав успешность проверки Обработчик вызовов для отображения ошибок Удалить все хранилища успехов или ошибок Reset проверка всей формы

Вот как это выглядит в коде:

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);

minified как расширение 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();

Ответ 3

Если вы хотите просто скрыть ошибки:

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

Если вы указали errorClass, вызовите этот класс, чтобы скрыть вместо этого error (по умолчанию), который я использовал выше.

Ответ 4

Если вы ранее не сохраняли валидаторы отдельно, присоединяя их к форме, вы также можете просто вызвать

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

как .validate() вернет те же самые валидаторы, которые вы прикрепляли ранее (если вы это сделали).

Ответ 5

Если вы хотите сделать это без использования отдельной переменной, то

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

Ответ 6

К сожалению, validator.resetForm() НЕ работает, во многих случаях.

У меня есть случай, когда, если кто-то попадает в "Отправить" в форме с пустыми значениями, он должен игнорировать "Отправить". Нет ошибок. Это достаточно легко. Если кто-то помещает частичный набор значений и хиты "Отправить", он должен отмечать некоторые из полей с ошибками. Если, однако, они уничтожить эти значения и снова нажать "Отправить", это должно устранить ошибки. В этом случае по какой-либо причине в массиве "currentElements" в валидаторе нет элементов, поэтому выполнение .resetForm() ничего не делает.

На этом есть ошибки.

До тех пор, пока они их не исправит, вам нужно использовать ответ Ника Крейвера, не принятый ответ "Попугаи".

Ответ 7

Вы можете использовать:

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

Ответ 8

Если вы хотите просто очистить ярлыки проверки, вы можете использовать код из jquery.validate.js resetForm()

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

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

Ответ 9

Я думаю, нам просто нужно вводить вводимые данные, чтобы очистить все

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

Ответ 10

Для тех, кто использует код Bootstrap 3 ниже, вы очистите всю форму: meassages, icons и colors...

$('.form-group').each(function () { $(this).removeClass('has-success'); });
$('.form-group').each(function () { $(this).removeClass('has-error'); });
$('.form-group').each(function () { $(this).removeClass('has-feedback'); });
$('.help-block').each(function () { $(this).remove(); });
$('.form-control-feedback').each(function () { $(this).remove(); });

Ответ 11

Я тестировал с помощью:

$("div.error").remove();
$(".error").removeClass("error");

Это будет нормально, если вам нужно снова проверить его.

Ответ 12

var validator = $("#myForm").validate();
validator.destroy();

Это уничтожит все ошибки проверки

Ответ 13

Попробуйте использовать:

onClick="$('.error').remove();"

на кнопке "Очистить".

Ответ 14

Попробуйте использовать это для удаления проверки при нажатии на кнопку отмены

 function HideValidators() {
            var lblMsg = document.getElementById('<%= lblRFDChild.ClientID %>');
            lblMsg.innerHTML = "";           
            if (window.Page_Validators) {
                for (var vI = 0; vI < Page_Validators.length; vI++) {
                    var vValidator = Page_Validators[vI];
                    vValidator.isvalid = true;
                    ValidatorUpdateDisplay(vValidator);
                }
            } 
        }

Ответ 15

Чтобы удалить сводку проверки, вы можете написать это

$('div#errorMessage').remove();

Однако, как только вы удалите, снова, если проверка не прошла, он не покажет это резюме проверки потому что вы его удалили. Вместо этого используйте скрытие и отображение, используя приведенный ниже код

$('div#errorMessage').css('display', 'none');

$('div#errorMessage').css('display', 'block');

Ответ 16

Ни один из вышеперечисленных решений не работал у меня. Я был разочарован тратой времени на них. Однако есть простое решение.

Решение было достигнуто путем сравнения маркировки HTML для допустимого состояния, а HTML - для состояния ошибки.

Никаких ошибок не будет:

        <div class="validation-summary-valid" data-valmsg-summary="true"></div>

когда возникает ошибка, этот div заполняется с ошибками, а класс изменен на валидацию-сводки-ошибки:

        <div class="validation-summary-errors" data-valmsg-summary="true">

Решение очень простое. Очистите HTML файл div, который содержит ошибки, а затем верните класс в правильное состояние.

        $('.validation-summary-errors').html()            
        $('.validation-summary-errors').addClass('validation-summary-valid');
        $('.validation-summary-valid').removeClass('validation-summary-errors');

Счастливое кодирование.

Ответ 17

Если вы хотите reset numberOfInvalids(), а затем добавить следующую строку в resetForm в строку jquery.validate.js номер строки: 415.

this.invalid = {};

Ответ 18

Я просто сделал

$('.input-validation-error').removeClass('input-validation-error');

чтобы удалить красную границу полей ввода.

Ответ 19

$(FORM_ID).validate().resetForm(); все еще работает не так, как ожидалось.

Я очищаю форму с resetForm(). Он работает во всех случаях, кроме одного!

Когда я загружаю какую-либо форму через Ajax и применяю проверку формы после загрузки динамического HTML, после этого, когда я пытаюсь reset создать форму с resetForm(), и она терпит неудачу, а также она сбрасывает все проверки, которые я применяю на элементах формы.

Так любезно не используйте это для загруженных форм Ajax или вручную инициализированную проверку.

P.S. Для такого сценария, который я объяснил, вам нужно использовать Nick Craver.

Ответ 20

В моем случае это помогло:

$(".field-validation-error span").hide();

Ответ 21

Если вы хотите скрыть проверку на стороне клиента, которая не является частью представления формы, вы можете использовать следующий код:

$(this).closest("div").find(".field-validation-error").empty();
$(this).removeClass("input-validation-error");

Ответ 22

Метод validator.resetForm() очищает текст ошибки. Но если вы хотите удалить RED-границу из полей, вам нужно удалить has-error класса

$('#[FORM_ID] .form-group').removeClass('has-error');

Ответ 23

Пробовал каждый ответ. Единственное, что сработало для меня, было:

$("#editUserForm").get(0).reset();

С помощью:

jquery-validate/1.16.0

jquery-validation-unobtrusive/3.2.6/

Ответ 24

Ни один из других решений не работал для меня. resetForm() явно документирован для сброса фактической формы, например, удалить данные из формы, чего я не хочу. Иногда бывает, что иногда этого не происходит, но просто удаляйте ошибки. Что, наконец, помогло мне в этом:

validator.hideThese(validator.errors());