Проверка jQuery - выделение меток радио

Question

Я пытаюсь использовать проверку jQuery, чтобы выделить метки только для моих переключателей, а не метки для других моих входов. У меня есть ярлык для моего переключателя, который называется «тип». Я не могу заставить его работать!

$(document).ready(function(){
    $("#healthForm").validate({

 highlight: function(element, errorClass) {
     $(element).addClass(errorClass)
     $(element.form).find("label[for='type']")
                    .addClass("radioerror");
  },
  unhighlight: function(element, errorClass) {
     $(element).removeClass(errorClass)
     $(element.form).find("label[for='type']")
                    .removeClass("radioerror");
  },
    errorPlacement: function(error, element) {
        }
    });
  });

Answer 1

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

$(element.form).find("label[for='type']")

Во-первых, я думаю $(element.form) должно быть $(element).closest('form')? Я могу ошибаться: P

Во-вторых, .find("label[for='type']") не имеет ничего общего с "element", так как любые другие элементы в той же форме будут получать ту же метку.

Если метка является родственным элементом радиокнопки, вы можете использовать sibling () напрямую.

Answer 2

Я изменил ваш код на следующий, и тогда он работает!

$(document).ready(function(){
    $("#healthForm").validate({
        highlight: function(element, errorClass) {

            if(element.type == 'radio') {
                $(element.form).find('[name="' + element.name + '"').each(function(){
                    var $this = $(this);
                    $this.closest('label[for="' + $this.attr('id') + '"').addClass(errorClass);
                });
            }

        },
        unhighlight: function(element, errorClass) {

            if(element.type == 'radio') {
                $(element.form).find('[name="' + element.name + '"').each(function(){
                    var $this = $(this);
                    $this.closest('label[for="' + $this.attr('id') + '"').removeClass(errorClass);
                });
            }

        },
        errorPlacement: function(error, element) {
        }
    });
});