jQuery Подтвердить плагин: обратный вызов, когда значение элемента действительно

Question

errorPlacement: function(error, element) { 
      if(element.hasClass('chosen-select')){ 
       error.insertAfter(element.next()); 
       element.next().addClass('error'); 
      } 
} 

Если в элементе select не используется значение, используя приведенный выше код, я могу легко добавить ошибку класса в нужный элемент. Но проблема в том, когда значение элемента действительно (в этом случае, когда выбран любой параметр) Как удалить этот класс, который я добавил в событие errorPlacement?

Есть ли какое-либо событие, которое будет запущено, когда значение элемента будет действительным?

Answer 1

Ваш код:

errorPlacement: function(error, element) { 
    if(element.hasClass('chosen-select')){ 
     error.insertAfter(element.next()); 
     element.next().addClass('error'); 
    } 
} 

errorPlacement функция обратного вызова только выстрелил раз поместить начальную метку ошибки. Он не будет работать, поскольку сообщения об ошибках приходят и уходят, потому что плагин автоматически переключает их.

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

Я не могу точно сказать, что будет работать для вас, потому что вы не представили краткую рабочую демонстрацию. Тем не менее, похоже, что вы должны использовать функции обратного вызова highlight и unhighlight, если вы хотите переключать классы. Имейте в виду, что, используя свои собственные функции highlight/unhighlight, они заменят значения по умолчанию для плагина.

errorPlacement: function(error, element) { 
    if(element.hasClass('chosen-select')){ 
     error.insertAfter(element.next()); 
    } 
}, 
highlight: function(element, errorClass, validClass) { 
    $(element).next().addClass('error'); 
}, 
unhighlight: function(element, errorClass, validClass) { 
    $(element).next().removeClass('error'); 
} 

И поскольку класс ошибок по умолчанию error, вы можете просто использовать errorClass аргумент.

errorPlacement: function(error, element) { 
    if(element.hasClass('chosen-select')){ 
     error.insertAfter(element.next()); 
    } 
}, 
highlight: function(element, errorClass, validClass) { 
    $(element).next().addClass(errorClass); 
}, 
unhighlight: function(element, errorClass, validClass) { 
    $(element).next().removeClass(errorClass); 
} 

See the docs for all available callback functions and options.

---

Дополнительные справочные

Это обратного вызова по умолчанию Функции:

highlight: function(element, errorClass, validClass) { 
    if ($(element).attr("type") === "radio") { 
     this.findByName($(element).attr("name")).addClass(errorClass).removeClass(validClass); 
    } else { 
     $(element).addClass(errorClass).removeClass(validClass); 
    } 
}, 
unhighlight: function(element, errorClass, validClass) { 
    if ($(element).attr("type") === "radio") { 
     this.findByName($(element).attr("name")).removeClass(errorClass).addClass(validClass); 
    } else { 
     $(element).removeClass(errorClass).addClass(validClass); 
    } 
} 

Источник: http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js

Answer 2

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

form.validate({ 
     rules: { 
      Name: { 
       required: true 
      }, 
      Email: { 
       required: true 
       , regex: "^[0-9a-zA-Z.+_\-]+@{1}[0-9a-zA-Z.+_\-]+\\.+[a-zA-Z]{2,4}$" 
      } 
     }, 
     messages: { 
      Name: { 
       required: "Please give us your name" 
      }, 
      Email: { 
       regex: "Please enter a valid email address" 
      } 
     }, 

     errorPlacement: function(error, element) { 
      element.parent().addClass("error"); 
     }, 

     success: function(element) { 
      $("#" + element.attr("for")).parent().removeClass("error"); 
     } 
    });