Wie wird mit Hilfe von JavaScript ein Formular überprüft ?

Eigentlich habe ich alle wichtigen Objekte, Methoden und Ereignisse im Zusammenwirken von JavaScript und HTML-Formularen in HTML-Dokumenten bereits besprochen. Auch sind alle notwendigen Funktionen zur Überprüfung eines Formulares von mir schon näher erläutert worden.

Und was letztendlich jeder Einzelne in seinem erstellten Formular überprüft (überprüfen sollte), muß jeder schon selber für sich entscheiden. Daher kann mein Beispiel auch nur einen Anhalt dafür bieten, was möglich ist. Ich empfehle aber jedem, zumindest die E-Mail-Adresse abzufragen.

Eine E-Mail-Adresse wird am sinnvollsten geprüft, indem man feststellt, ob ein "@" und ein "." nach dem "@" in der E-Mail-Adresse vorhanden ist:

  function check()
   {
   var status=true;
   var email=document.form1.mailto.value;
   if(email == "")
    {
    alert("Bitte geben Sie Ihre E-Mail-Adresse an !");
    status=false;
    }
   else
    {
    kk=email.indexOf("@");
    if(kk <= 0 || email.indexOf(".", kk) < 0)
     {
     alert("Ihre E-Mail-Adresse ist fehlerhaft !");
     status=false;
     }
    }

Im Beispiel "Pizza-Bestell-Formular" wird die funktion "check" aufgerufen, wenn ein Besteller den "Bestellen"-Button anklickt. Hier wird nun geprüft, ob eine sinnvolle E-Mail-Adresse eingegeben wurde. Falls die Prüfung das Ergebnis "false" (falsch) liefert, wird die Funktion verlassen und das Formular nicht abgesendet.

Wird hingegen der Button "Rücksetzen" angeklickt, wird vorsichtshalber nachgefragt, ob diese Aktion auch wirklich beabsichtigt war.

Beide Aktionen treffen also nur speziell auf dieses Formular zu und müssen daher auch speziell für dieses Formular definiert werden:

  <form name="form1" method="post"
   action="mailto:niemand @nirgendwo.einhost.net"
   method=post enctype="text/plain"
   onSubmit="return check();"
   onReset="return confirm('Wirklich zurücksetzen?');">


Hinweis: (Nachtrag 1)

Die Funktion "parseInt" sucht am Anfang der ihr übergebenen Zeichenkette nach einem ganzzahligen Wert. Beginnt die Zeichenkette mit einer "0" , ist die darauf folgende Zahl eine oktale Zahl. Folgt auf die "0" ein kleines "x" ("0x"), ist die folgende Zahl eine hexadezimale Zahl.

Leider kann ich hier keine eindeutige Aussage über das Fehler-Verhalten der Funktion treffen, da auf unterschiedlichen Betriebssystemen mit unterschiedlichen Browsern unterschiedliche Ergebnisse zurückgeliefert werden. Meist jedoch wird "NaN" für "not a number" (keine Zahl) geliefert. Seit JavaScript 1.2 kann dieser Fall mit der JavaScript-eigenen Funktion "isNaN" abgefragt werden (siehe Beispiel: Taschenrechner).

Zeichenkette     Ergebnis der Funktion parseInt()
123123
012383
0x123291
FehlerNaN


Hinweis: (Nachtrag 2)

Die Funktion "parseFloat" sucht in der ihr übergebenen Zeichenkette nach einer Zahl mit Komma. Im Gegensatz zu "parseInt" werden oktale und hexadezimale Zahlen nicht berücksichtigt.

Leider kann ich hier keine eindeutige Aussage über das Fehler-Verhalten der Funktion treffen, da auf unterschiedlichen Betriebssystemen mit unterschiedlichen Browsern unterschiedliche Ergebnisse zurückgeliefert werden. Meist jedoch wird "NaN" für "not a number" (keine Zahl) geliefert. Seit JavaScript 1.2 kann dieser Fall mit der JavaScript-eigenen Funktion "isNaN" abgefragt werden (siehe Beispiel: Taschenrechner).

Zeichenkette     Ergebnis der Funktion parseFloat()
123123
0123123
0x1230
FehlerNaN

Zum Schluß ein Beispiel dafür, wie das bisher gesagte in der Praxis aussehen könnte. Auf Grund der Größe des JavaScriptes für dieses Bestell-Formular, habe ich an dieser Stelle auf ein Listing verzichtet. Wer mag, kann es sich hier downloaden (1,5 Kb).

5 Anmerkungen zum Download:

  • Wenn Sie etwas bei dem "Pizza-Versand" bestellen; also, wenn Sie einen Eintrag in einem Feld "Anzahl" vornehmen, wird der "Gesamtpreis" sowie die neue "Gesamtsumme" errechnet und automatisch in die entsprechenden Felder eingetragen.

  • Versuchen Sie hingegen den vom "Pizza-Versand" vorgegebenen "Einzelpreis" zu ändern, wird dies nicht akzeptiert und Sie erhalten eine Information dazu.

  • Möchten Sie dem "Pizza-Versand" einen höheren "Gesamtpreis" zukommen lassen, ist dies durchaus möglich, weniger darf es aber nicht sein.

  • Bevor das Bestell-Formular entgültig gesendet wird, prüft das Programm zunächst, ob Sie eine gültige E-Mail-Adresse angegeben haben. Unter gültiger E-Mail-Adresse versteht der "Pizza-Versand", ob die E-Maill-Adresse ein "@" und mindestens einen "." nach dem "@" enthält.

  • Als Zweites wird vor dem senden geprüft, ob mindestens eine Pizza bestellt wurde. Also, daß Programm prüft, ob mindestens ein Feld "Anzahl" einen Wert größer "0" hat.
 
 
 
 Kontakt | Übersicht | Komplex-Suche | AGB | Impressum | Datenschutz
Copyright © 2012 Juniors-Workstation. Alle Rechte vorbehalten.
Joomla! ist freie, unter der GNU/GPL-Lizenz veröffentlichte Software.
 
 
     
 
   
Design by windows vista forum and energiesparlampen