Ошибка проверки JQueryPlace Успех против отказа

Question

Я использую jQuery Validation для формы, и мне нужно отобразить галочку рядом с полем ввода (если запись была правильной) и сообщение об ошибке (пример: «пожалуйста, введите не менее 4 символов») поле ввода.

Я думал сделать что-то вроде этого:

errorPlacement: function (error, element) {
* если проверка прошла успешно * error.appendTo ($ ( "# галочка")); * иначе * error.appendTo ($ ( "# сообщения об ошибке")); }

Но как вы можете настроить таргетинг на другое назначение div в зависимости от типа сообщения, которое вы хотите отобразить? Или я совершенно не прав, и есть другой способ сделать это?

Спасибо!

Answer 1

5 месяцев с опозданием ... надеюсь, это все еще полезно:

jQuery.validate использует опцию errorPlacement: для передачи аргументов об ошибках и элементах, чтобы вы могли делать с ними все, что захотите ... и функция выполняется каждый раз, когда в форме пользователя возникает ошибка. Его аналогом является success:, который передает метку в качестве опции.

Но для максимальной гибкости вам даже не нужно использовать «ярлык». Вместо этого вы можете передать объект jQuery из errorPlacement (на основе обхода от «элемента» объекта) к опции success:. И успех рассчитывается в режиме реального времени.

Все немного запутанно, но вот некоторый общий код ...

Для вашего HTML вы можете поставить:

<div class="errorparent">
<input type="text" id="username" name="username"/>
<div class="norederrorx errordetails">&nbsp;</div>
</div>

Чтобы найти свой пользовательский div в опциях jQuery.validate:

errorPlacement: function(error, element) {
   var errorcontent=eval(error);
   errorspotholder = element.parents('.errorparent');

И в вашем варианте успеха:

errorspotholder.find('.rederrorx').removeClass('rederrorx').addClass('norederrorx');

Если вы хотите манипулировать еще большим количеством элементов div ... например, отдельным допустимым тегом div, вам просто нужно перейти к объекту, отличному от «errorsotholder», который ссылается на содержащий родительский элемент div «errorparent»

Всего наилучшего!

Emile

Answer 2

Вы можете найти это выражение в файле jquery.validate.js:

 this.settings.success( label )

и замените его на:

 this.settings.success( label, element)

Этот трюк восстанавливает jquery-validate, как они сказали в своей документации.

Answer 3

В прошлом я делал это с помощью опции validClass для допустимых:

$(".selector").validate({
   validClass: "success"
})

success может быть просто классом css с фоном галочки сбоку:

.success {
  background: url(checkmark.png) right no-repeat; /* Say, 16x16px */
  margin-right: 18px;
}