[jQuery] [Validation] How to add a pending (spinner) label to a remote validation

[Rus Miller]

It's not pretty but it seems to work.  I'd ideally like to tap into
the error/success label display but I couldn't figure out how, so
right now this only works for remote validation rules.  It might also
be interesting to have the option to make these labels instances of
the Tooltip plugin.  Then again, it might not.

Anyway, on with the show...

There are 4 modifications to jquery.validate.js and 1 class to add to
your stylesheet.  Please let me know if it can be done better.

New default property:

Line 149
/*+*/
pendRequestClass: "pending",
/*-*/

Two new methods:

Line 583
/*+*/
pendRequestFor: function(element){
                return this.pendRequest().filter("[EMAIL PROTECTED]'" + 
this.idOrName(element)
+ "']");
},

pendRequest: function() {
                return jQuery( this.settings.errorElement + "." +
this.settings.pendRequestClass, this.errorContext );
},
/*-*/

Hack to startRequest method:

Line 598
/*+*/
var pendingLabel = jQuery("<" + this.settings.errorElement + "/>")
                .attr({"for":  this.idOrName(element), generated: true})
                .addClass(this.settings.pendRequestClass);
if ( this.settings.wrapper ) {
                // make sure the element is visible, even in IE
                // actually showing the wrapped element is handled elsewhere
                pendingLabel = pendingLabel.hide().show().wrap("<" +
this.settings.wrapper + ">").parent();
}
if ( !this.labelContainer.append(pendingLabel).length )
                this.settings.errorPlacement
                ? this.settings.errorPlacement(pendingLabel, jQuery(element) )
                : pendingLabel.insertAfter(element);
/*-*/

Hack to stopRequest method:

Line 617
/*+*/
var pendingLabel = this.pendRequestFor( element );
                if ( pendingLabel.length > 0 ) {
                        // refresh pending class
                        pendingLabel.remove();
}
/*-*/

New style class:
label.pending {
     /* some styles based on error label style for consistency */
     height: 16px;
     width: 16px;
     background-color: #000000;
     background-image: url(../img/spinner.gif);
}