Homepage de.comp.lang.javascript
Homepage
de.comp.lang.javascript

FAQ de.comp.lang.javascript

FAQ
de.comp.lang.javascript

 

 

Bitte verwenden Sie als Einstiegsadresse in diese FAQ die Homepage der Newsgroup de.comp.lang.javascript. Der Aufenthaltsort dieser Seiten hier kann sich ohne Vorwarnung ändern.
 

 

Wie prüfe ich die Korrektheit von Formularfeldern vor dem Abschicken?

Wird ein Formular über einen Submit-Button abgeschickt, so wird ein onSubmit-Event ausgelöst. Dies kann man ausnutzen, um die eingebenen Daten von einer Funktion überprüfen zu lassen. Ist alles okay, gibt die Funktion den booleschen Wert true zurück und das Formular wird "ganz normal" abgeschickt. Beim Rückgabewert false wird das Formular noch nicht versendet und der Benutzer erhält die Möglichkeit, die Eingaben nochmals zu korrigieren.

Die Test-Funktion (im HEAD) könnte in Kurzfassung etwa so aussehen:

function testForm() {
 var error = false;
 var error_message = "Eingabe-Fehler:\n";

 /* Ueberpruefen des Name-Feldes auf Inhalt */
 if (document.formular.namen.value == '') {
  error = true;
  error_message += "- Kein Name angeben!\n";
 }

 /* Ueberpruefen des eMail-Feldes auf Inhalt */
 if (document.formular.email.value == '') {
  error = true;
  error_message += "- Keine eMail angeben!\n";
 /* Ueberpruefen des eMail-Feldes auf das (at)-Zeichen */
 } else if (document.formular.email.value.indexOf("@") == -1) {
  error = true;
  error_message += "- Falsche eMail angeben!\n";
 }

 /* Ist irgendwo ein Fehler aufgetreten ? */
 if (error) {
  error_message += "\nBitte korrigieren !!!";
  alert(error_message);
  return false; //Formular wird nicht abgeschickt.
 } else {
  return true;  //Formular wird abgeschickt.
 }
}

Völlige Sicherheit erhält man durch diese einfache Testkriterien natürlich nicht, so gilt hier z.B. schon das Zeichen "@" als korrekte Mailadresse. Aber man kann schon 'mal grobe Fehleingaben ausfiltern und die Feinheiten etwa einem CGI-Script überlassen. Es können natürlich auch weitere Formular-Elemente wie z.B. Checkboxen oder Select-Felder auf "Korrektheit" geprüft werden.

In dem HTML-Formular (im BODY) muß dann nur noch der Submit-Event abgefangen werden, etwa so:

<form method="post" 
         action="/~sm/CGI/cgitest.sh" 
         name="formular" 
         onSubmit="return testForm();">
<input type="text" name="namen"><br>
<input type="text" name="email"><br>
<input type="submit" value="Testen und Abschicken">
</form>



top

Diese Seite ist Teil der de.comp.lang.javascript FAQ. Die Einstiegsadresse lautet http://www.dcljs.de/. Der Text der Seite wurde erstellt von Tobe Toben (©).

 ______ letzte Änderung: 12/2012 ______ 

 
© S. Mintert, Ch. Kühnel