Плагин jQuery Validation: добавить/удалить класс в/из контейнера ошибок элемента

Я работаю с плагином jQuery Validation, и я написал следующий код, который добавляет класс к элементу (<input>) parent (<label>), если он не действителен, а также вставляет фактический элемент ошибки (<span>) до <br>.

HTML...

<label>
    text<br><input>
</label>

... и jQuery.

$("#form_to_validate").validate({
    rules: {
    ...
    },
    errorElement: "span",
    errorPlacement: function(error, element) {
        element.parent().addClass('error');
        error.insertBefore(element.parent().children("br"));
    }
});

Итак, если элемент формы не проверяется, он превращается в:

<label class="error">
    text<span>error text</span><br><input>
</label>

Это отлично работает, однако, если содержимое поля будет исправлено и станет действительным, класс, очевидно, не будет удален из его родителя (на самом деле, ни элемент ошибки, а просто получает свойство display: none; CSS), Как проверить, является ли элемент действительным и удалить его родительский класс, если это так?

Любая помощь будет принята с благодарностью!

Отредактировано: добавлена дополнительная информация.

Ответ 1

После некоторых более тяжелых копаний я нашел ответ прямо под моим носом, но, к сожалению, для меня, хорошо скрытый. Плагин имеет встроенную функцию подсветки (сюрприз, сюрприз). Обычно это выделяет/выделяет элемент, но его можно легко преобразовать для работы с родителем элемента:

$("#form_to_validate").validate({
    rules: {
    ...
    },
    errorElement: "span",
    errorPlacement: function(error, element) {
        error.insertBefore(element.parent().children("br"));
    },
    highlight: function(element) {
        $(element).parent().addClass("error");
    },
    unhighlight: function(element) {
        $(element).parent().removeClass("error");
    }
});

Я надеюсь, что это поможет кому-то!

Ответ 2

errorElement: 'none' работал у меня.