Because you are adding the error class to your default label, and the validation plugin uses that to identify the generated error labels. Use a different class in your highlight/unhighlight options, with the same styles, and it'll work.
Jörn On Mon, Jun 22, 2009 at 4:46 PM, ypy<pgeorge....@gmail.com> wrote: > > Why do the form's labels disappear once a required field is filled ? > I Use the last versions of jquery and validate plugin > > > On 18 juin, 11:52, ypy <pgeorge....@gmail.com> wrote: >> Hi, >> >> Let me describe the problem I have to solve : >> >> When a field is unvalid : its label gets the errorClass class. >> Allright ! >> >> When the field gets valid : the label, instead of only "loosing" the >> "error" class, completely disappears (style="display: none;"). >> >> How can I keep my labels displayed when the validation is OK ? >> >> I described this as a bug (http://plugins.jquery.com/node/8592), I >> have been answered :" Adding the errorClass to the regular element >> doesn't work - the plugin uses the errorClass to find the label to >> show/hide. Use a different class (with the same styles) to fix this." >> >> I understood I had to specify an errorClass, but it doesn't solve the >> problem. >> >> Any idea ? >> >> Ypy >> >> ------------------------------------------------- >> Here is the source code used : >> >> jQuery.extend(jQuery.validator.messages, { >> // quand le champ est invalide >> email: "Veuillez entrer une adresse email valide.", >> }); >> $(document).ready(function() { >> >> // validate signup form on keyup and submit >> var validator = $("#formulaire").validate({ >> rules: { >> Nom: "required", >> Email: { >> required: true, >> email: true, >> >> }, >> }, >> >> errorClass: "champrequisvide", >> >> errorContainer: "#messageChampsManquants", >> >> // classe à appliquer pour les champs manquants et leurs labels >> highlight: function(element, errorClass) { >> $(element).addClass(errorClass); >> $(element.form).find("label[for=" + element.id + "]").addClass >> (errorClass); >> }, >> >> unhighlight: function(element, errorClass) { >> $(element).removeClass(errorClass); >> $(element.form).find("label[for=" + element.id + "]").removeClass >> (errorClass); >> }, >> >> }); >> }); >> >> PS : It seems it has been solved there (at least for select fields, >> doesn't work for text >> inputs):http://groups.google.com/group/jquery-en/browse_thread/thread/d643212792...
