Häufig bekomm ich die Anforderung, Formulare aufzuhübschen. Meistens wünschen sich Kunden, dass diese nicht mehr so aufgebläht wirken. Man packt also den label-Text ins Input und versteckt das label. Natürlich kann man jetzt nicht mehr ohne Nachbessern jQuery validate verwenden, da alle Inputs bereits ausgefüllt wurden. Nach ein wenig debugging wird klar, dass $.validate.prototype.checkForm so angepaßt werden muss, dass das Formular erst wieder resetted wird.

Der falsche Weg

Sorgenfrei und gedankenlos passt man direkt in dem Plugin den Code an. Natürlich funktioniert die Lösung gleich, allerdings hat man jetzt den Nachteil, dass man das Plugin nicht mehr “mal eben” updaten kann - die Änderung muss mit jedem Update wieder reingemerged werden. Geht man bei vielen Plugins so vor, ist man sehr schnell an eine bestimmte jQuery-Version gebunden, ein Update der Seite wird schnell teuer.

Der saubere Weg

jQuery bietet einem bereits mit jQuery extend eine einfache Lösung, Objekte zu kopieren bzw. zu erweitern. Damit kann man sauber und ohne ins Plugin direkt einzugreifen den Prototype erweitern, indem man diesen in ein Closure wrappt:

$.extend( $.validator.prototype, (function ( origCheckForm ) {
    return {
        checkForm: function () {
            resetForm();
            origCheckForm.apply( this, arguments )
        }
    };
})( $.validator.prototype[ "checkForm" ] ));

Zack und fertig :)