Eigene Formular-Validierung

[molily]

Hallo,

if( !$.validator.checkEmail ) {
  sendForm = false;
}

Das ergibt so keinen Sinn (ist dir wohl schon aufgefallen).

Der Aufruf müsste/könnte lauten (ohne Vaiablen):
$("#mail").validate.checkmail();
oder
$("#mail").checkmail();

checkmail ist in deinem Code keine Methode von jQuery-Objekten. Sie ist eine Methode von $.validator. Sie kann nur über $.validator.checkMail angesprochen und entsprechend aufgerufen werden.

Wenn du beim Aufruf das event-Objekt übergibst, dann fehlt noch das this-Binding. this soll in der Funktion ja auf das Eingabefeld (input-Element) zeigen – so ist es üblich in Event-Handlern. Mit der call-Methode kannst du eine Funktion aufrufen und den this-Wert bestimmen. Möglich wäre (ungetestet):

var input = $("#" + event.data.key ).get(0);  
$.validator.checkMail.call(input, event);

So würde die checkMail-Funktion das Eventobjekt erhalten und »this« würde darin auf das input-Element zeigen.

Allerdings ist das ziemlich gefrickelt und ich würde es nicht empfehlen.

Wenn du checkMail in verschiedenen Kontexten verwenden willst, so sollte sie kein Event-Handler sein, sondern eine wiederverwendbare Funktion, die alle nötigen Daten gezielt als Parameter bekommt. Das Durchreichen von Daten mithilfe von event.data hingegen ist nicht schön, ich würde davon abraten.

Wenn die Regeln funktional mit jQuery.each durchlaufen werden, dann sind Closures möglich. Es ist ferner sinnvoll, die Verarbeitung in kleine Funktionen aufzuteilen, anstatt alles tief zu verschachteln. Durch gezielte, sparsam eingesetzte Verschachtelung kann man Closures erzeugen, um gewisse Daten einzuschließen.

Beispielhafter Aufbau (ungetestet):

(function($) {  
  
/* Helferfunktionen */  
  
var isEmail = function(value) {…};  
  
// Nimmt ein Element (jQuery-Objekt) und eine Regel entgegeben,  
// gibt true oder false zurück je nach Validität  
var checkMail = function(element, rule) {  
  var value = element.val();  
  var errorMsgField = $("#" + rule.errorMsgField);  
  if (!isEmail(value))  
    element.addClass(rule.cssClass);  
    errorMsgField.html(rule.message.email);  
    return false;  
  } else {  
    element.removeClass(rule.cssClass);  
    errorMsgField.html("");  
    return true;  
  }  
};  
  
// Defaults  
var optionsDefaults = {…};  
var ruleDefaults = {…};  
  
// Arbeitet eine Regel ab  
var processRule = function(id, rule, options) {  
  rule = $.extend({}, ruleDefaults, rule);  
  // Hole das Element  
  var element = $("#" + id );  
  
  if (options.onLive) {  
    if (rule.email) {  
      element.keyup(function () {  
        // Verschachtelte Funktion, die Zugriff auf id, rule, options und element hat  
        // Rufe Helferfunktion auf, übergebe alle notwendigen Daten:  
        return checkEmail(element, rule);  
      });  
    }  
  }  
  
  // usw.  
  
};  
  
// Das eigentliche jQuery-Plugin, die Funktion $(…).validate()  
$.fn.validate = function(options) {  
  options = $.extend({}, optionsDefaults, options);  
  // Durchlaufe alle Regeln  
  jQuery.each(options.rules, function(id, rule) {  
    // Verschachtelte Funktion, die Zugriff auf id, rule und options hat  
    // Rufe für jede Regel processRule auf und übergebe die notwendigen Daten  
    processRule(id, rule, options);  
  });  
  return this;  
};  
  
})(jQuery);

Den Part zu onsubmit kannst du anhand dessen wahrscheinlich hinbekommen.

Grüße,
Mathias