jQuery Validation - Mise en surbrillance des étiquettes radio

Question

J'essaie d'utiliser la validation jQuery pour mettre en surbrillance les libellés de mes boutons radio uniquement, et non les libellés de mes autres entrées. J'ai une étiquette pour mon jeu de boutons radio appelé «type». Je n'arrive pas à le faire fonctionner!

$(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

Je ne suis pas vraiment familier avec le plug-in de validation de jQuery, mais celui-ci ne semble pas juste:

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

Tout d'abord, je pense que $(element.form) devrait être $(element).closest('form')? Je peux me tromper: P

Deuxièmement, .find("label[for='type']") n'a rien à voir avec le "element" comme tous les autres éléments de la même forme vont chercher la même étiquette. Si l'étiquette est le frère du bouton radio, vous pouvez utiliser directement sibling().

Answer 2

J'ai changé votre code pour le suivant et puis ça marche!

$(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) { 
     } 
    }); 
});