First, let me say my skill level with jQuery and javascript is low.
Apparently too low to figure this out. I am currently using the
Validate plugin for form validation. It works well, except for this
problem: when an element validates, the label element disappears.
I'm using the following code straight from this page :
http://docs.jquery.com/Plugins/Validation/validate#toptions
$(".selector").validate({
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);
}
});
My goal is to use the labels as error indicators, turning them red on
error. The code above, together with some css, works great for this.
But when the error is corrected, the label disappears completely (the
Validate plugin adds display:none to the label tag).
To correct this Jorn said:
Don't add the error class to the label. The validation plugin searches
for the error label based on that error class - adding it to the
actual label causes the label to disappear.
You could add a different class to the actual label so that the error
label can be hidden or removed entirely (via errorPlacement, or
showErrors).
I have tried this to the best of my limited ability - without
success. Can anyone give me a coded example of this? Should I not be
using the code sample above? I can't figure out how to highlight the
label on error, but not "add the error class to the label." Again,
I'm somewhat javascript-challenged, so code examples would be
appreciated.
Thanks!
