jquery AutoResize casse validation de formulaire pour textareas

Question

Voici un extrait de la jquery:

$(document).ready(function() {
 $('textarea').autoResize();

 $('#submitSurvey').click(function() {

- sauter plusieurs lignes -

  $("input[id$='Buggy']:radio:checked").each(function() {// If any radio buttons are marked "Buggy" and no comment is left, require comment
   var parent = $(this).parent().get(0);// parent element of the radio button
   var nextCommentDiv = $(parent).nextAll('.comments').get(0);
   var txtarea = $(nextCommentDiv).children('.itemComment').get(0);// comment for the radio button marked "Buggy"
   var surroundingDiv = $(parent).parent().get(0);
   var heading = $(surroundingDiv).prev();// section title
   if(txtarea.value == '' || txtarea.value == 'Type comments here') {
    $(txtarea).addClass('invalid');
    $(heading).addClass('redtext');
    valid = false;
   } 
  });
 });
});

Voici un extrait du code html:

<div class="subQ">Question 1</div>
<div class="ratings">
 <input type="radio" name="item1" id="item1Works" value="Works" /><label for="item1Works"> Works </label>
 <input type="radio" name="item1" id="item1Buggy" value="Buggy" /><label for="item1Buggy"> Buggy </label>
 <input type="radio" name="item1" id="item1na" value="Not Tested" /><label for="item1na"> Didn't Test</label>
</div><br />
<div class="subQ">Question 2</div>
<div class="ratings">
 <input type="radio" name="item2" id="item2Works" value="Works" /><label for="item2Works"> Works </label>
 <input type="radio" name="item2" id="item2Buggy" value="Buggy" /><label for="item2Buggy"> Buggy </label>
 <input type="radio" name="item2" id="item2na" value="Not Tested" /><label for="item2na"> Didn't Test</label>
</div><br />
<div class="subQ">Question 3</div>
<div class="ratings">
 <input type="radio" name="item3" id="item3Works" value="Works" /><label for="item3Works"> Works </label>
 <input type="radio" name="item3" id="item3Buggy" value="Buggy" /><label for="item3Buggy"> Buggy </label>
 <input type="radio" name="item3" id="item3na" value="Not Tested" /><label for="item3na"> Didn't Test</label>
</div><br />
<div class="comments">
 <textarea class="itemComment" name="itemsComment" id="itemsComment" rows="1">Type comments here</textarea>
</div>

Notez qu'il peut y avoir plusieurs questions dans un groupe avec un seul champ de commentaire. Les contrôles de validation du groupe pour les boutons radio portant la mention « Buggy » et si elle en trouve, il met une bordure rouge autour du champ de commentaire à obliger l'utilisateur à commentaire sur la zone buggy (le formulaire est pour les testeurs bêta d'une application de bureau ).

Pour une raison quelconque, quand j'ajoute le AutoResize à tous mes textareas, la ligne de ma validation ne fonctionne plus (mais la ligne $ (rubrique suivante $ (txtarea) .addClass ( « invalide »)) .addClass ( 'redtext') fonctionne). Je ne reçois pas d'erreurs dans Firefox ou Firebug. Je suis sûr que mon code est un maladroit de peu, je suis nouveau jquery donc beaucoup des sélecteurs de traversal DOM ne sont que « ce qui a fonctionné ».

Voici un lien vers la AutoResize plug-in jquery .

Toutes les suggestions?

Je suis un débutant et javascript jquery, alors ne me donne pas trop de temps à mon code amateur:)

Answer 1

Il n'y a pas eu beaucoup d'entrée, donc je continuais à la recherche d'une autre solution et je crois que je l'ai trouvé un acceptable. smartArea plug-in est un plus petit, plus simple plug-in qui ne regarde essentiellement la même chose, mais il ne certes pas aussi agréable (les textareas ne le font pas Animer et barres de défilement clignotent pendant que vous tapez à moins que vous définir explicitement la propriété de débordement de css « caché »). Cependant, pour mes besoins, il fait le tour et ma forme de validation fonctionne toujours.

Je suis sûr que je pourrais ajouter dans le code pour animer et gérer la propriété de débordement, mais « si elle est pas cassé ... »

Encore une fois, des commentaires sur ce que sont les bienvenus Je suis toujours désireux d'en savoir plus (d'autant plus que je ne l'ai pas fait résoudre le problème, mais plutôt une solution juste trouvé).