Bücher online kostenlos Kostenlos Online Lesen
JQuery Kochbuch (German Edition)

JQuery Kochbuch (German Edition)

Titel: JQuery Kochbuch (German Edition) Kostenlos Bücher Online Lesen
Autoren: jQuery Community Experts
Vom Netzwerk:
nutzen will. In diesem Beispiel wird die Methode
required
mit einem Alias
customerRequired
versehen, der eine andere Standard-Meldung besitzt:
$.validator.addMethod("customerRequired", $.validator.methods.required,
"Kundenname erforderlich");
    In
additionalMethods.js
finden Sie eine Reihe fertiger »selbstdefinierter« Funktionen für das Plugin.
    Regeln
    Es gibt vier verschiedene Wege, Regeln festzulegen: zwei per Code und zwei inline als Metadaten. Das vorherige Beispiel greift auf Klassen und Attribute als Metadaten zurück, die vom Plugin standardmäßig unterstützt werden. Wenn das Plugin metadata verfügbar ist, können die Regeln auf unterschiedliche Art und Weise eingebettet werden, zum Beispiel innerhalb des Attributs
class
:

    Hier enthält die Klasse JavaScript-Literale, die in geschweiften Klammern eingeschlossen sind, was der Syntax mit der Option
rules
im Code stark ähnelt:
$("#myform").validate({
    rules: {
     name: {
     required: true,
     minlength: 2
     },
     email: {
     required: true,
     email: true
     },
     url: "url",
     comment: "required"
    }
});
    Die Objekt-Schlüssel wie
name
,
email
,
url
und
comment
beziehen sich immer auf den Namen des Elements, nicht auf die ID.
    Beachten Sie die Syntax-Kurzform für
url
und
comment
, bei der nur eine einzelne Regel notwendig ist. Nutzt man Regeln mit Parametern, wie zum Beispiel
minlength
, dann lässt sich diese Kurzform allerdings nicht verwenden.
    Manche Regeln sollen erst später hinzugefügt werden, was über den vierten Weg möglich ist – die Plugin-Methode
rules
:
// Erst initialisieren der Validierung
$("#myform").validate();
// Später mehr Regeln hinzufügen
$("#username").rules("add", { minlength: 2});
    Regeln können so auch entfernt werden:
$("#username").rules("remove", "required");
    Das kann praktisch sein, wenn man einen Link »Passwort vergessen« auf einer Anmelde-Form hinzufügen möchte:
$("#loginform").validate({
    username: "required",
    password: "required"
});
$("a#forgotPassword").click(function(e) {
    $("#password").rules("remove", "required");
    $("#loginform").submit();
    $("#password").rules("add", "required");
    return false;
});
    Dieser Click-Event-Code entfernt die Required-Regel für das Passwort, versucht dann, die Form abzuschicken (und dabei die Validierung auszulösen) und fügt anschließend die Regel wieder hinzu. So wird das Feld für den Benutzernamen immer noch überprüft. Schlägt die Validierung fehl, dann wird das Passwort-Feld auch wieder ein Pflichtfeld (für das nächste normale Abschicken).
    Abhängigkeiten
    Häufig hängt die Gültigkeit eines Feldes von mehr Faktoren ab, als nur einem angeklickten Link. Dies lässt sich über einen Parameter für die Methode
required
erledigen. Beim Parameter kann es sich um einen Selektor oder einen Callback handeln. Der Selektor ist nützlich, wenn die Abhängigkeit in einem einfachen Ausdruck formuliert werden kann. So ist zum Beispiel ein E-Mail-Feld vielleicht nur dann notwendig, wenn die Checkbox »Newsletter« markiert ist:
email: {
    required: "#newsletter:checked"
}
    Ein Callback kann für Ausdrücke beliebiger Komplexität genutzt werden, zum Beispiel, wenn das Feld vom Status mehrerer anderer Felder abhängt:
email: {
    required: function(element) {
     return $("#newsletter:checked").length && $("#telephone:blank");
    }
}
    Eigene Ausdrücke
    Das vorherige Beispiel hat den Ausdruck
:blank
genutzt, um ein Element nur dann zu wählen, wenn es keinen Wert oder höchstens Whitespace enthält. Das Plugin stellt auch den Ausdruck
:filled
bereit, das Gegenteil von
:blank
. jQuery selbst bietet noch
:checked
und das Validation-Plugin ergänzt dies durch das inverse
:unchecked
. Beide sind nützlich, wenn man Abhängigkeiten zu Radio Buttons oder Checkboxen definieren möchte.
    Sie können zwar
:not
nutzen, um
:filled
oder
:checked
umzukehren, aber
:blank
und
:unchecked
sorgen dafür, dass der Selektor lesbarer und damit verständlicher wird.
    Fehlermeldungen
    Wie bei Regeln gibt es ein paar Möglichkeiten, Meldungen festzulegen – sowohl per Code als auch inline. Inline-Meldungen werden über das Attribut
title
definiert:

    Damit wird eine einzelne Fehlermeldung für jede Regel erzeugt. Ein alternativer Inline-Ansatz ist die Verwendung des Metadata-Plugins (siehe Regeln ):
  • 1
  • 2
  • ...
  • 99
  • 100
  • 101
  • 102
  • 103
  • 104
  • 105
  • ...
  • 183
  • 184
  • Weitere Kostenlose Bücher