Plugin JQuery validation - error mettre en lumière les problèmes

J'ai un formulaire avec deux zones de saisie de texte, et j'ai inclus jQuery règles de validation pour les deux:

<script src="../../Scripts/jquery-validate/jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
    $('#respondForm').validate({ onclick: false,
      onkeyup: false,
      onfocusout: false,
      highlight: function(element, errorClass) {
        $(element).css({ backgroundColor: 'Red' });
      },
      errorLabelContainer: $("ul", $('div.error-container')),
      wrapper: 'li',
      rules: {
        'text': {
          required: true,
          minlength: 5,
          maxlength: 10
        },
        integer: {
          required: true,
          range: [0, 90]
        }
      },
      messages: {
        'text': {
          required: "xxx_Required",
          minlength: "XXX Should be greater than 5",
          maxlength: "XXX Cannot be greater than 10"
        },
        integer: {
          required: "is required",
          range:  "is out of range: [0,90]"
        }
      }
    });
  });
</script>
</head>
.
.
.
<input type="text" id="text" name="text" />    
<br />
<input type="text" id="integer" name="integer" />
<br />
<input type="submit" name="submit" value="Submit" />
<br />

J'ai utilisé:

function(element, errorClass) {
  $(element).css({ backgroundColor: 'Red' });
}

pour mettre en évidence le contrôle d'erreur. Maintenant, le problème est que dans le scénario suivant, les deux zones de saisie de texte mise en surbrillance en arrière-plan (couleur: rouge):

  1. De saisie de texte avec moins de 5 caractères dans la zone de texte 1
  2. Laisser 2 de zone de texte vide
  3. Cliquez sur envoyer
  4. À la fois d'entrée de la zone de texte d'arrière-plan sera changé en rouge (qui est correcte)
  5. Maintenant entrer un texte qui a 6 caractères dans la zone de texte 1 (entrée valide)
  6. Laisser 2 de zone de texte vide
  7. Cliquez sur envoyer
  8. La couleur d'arrière-plan pour les deux zones de texte reste en rouge. Où, comme on s'attend à ce que la couleur d'arrière-plan de la zone de texte 1 ne doit pas être rouge

Comment puis-je résoudre ce problème?

OriginalL'auteur Ngm | 2009-11-10