JavaScript

Versehentliches Abschicken von Formularen verhindern

Details

Veröffentlicht am Mittwoch, 08. Oktober 2008 18:44

Geschrieben von Jan Pionzewski

Formulare lassen sich bekanntlich auch mit dem Drücken der Enter-Taste abschicken. Jedoch natürlich auch dann, wenn das Formular noch nicht vollständig ausgefüllt wurde. Um ein versehentliches Absenden des Formulares zu verhindern, gibt es verschiedene Möglichkeiten.
Entweder, man lässt durch ein Script die Formularfelder prüfen, oder man vertauscht einfach die Tastenfunktionen auf der Tastatur.

Mit dem folgenden Beispiel wird die Enter-Taste in ihrer Funktion vorübergehend in die Tabulator-Taste verwandelt, mit der man zum nächsten Formularfeld springen kann. Das Formular kann erst dann abgeschickt werden, wenn der User den Senden-Button anklickt, oder dann Enter drückt, wenn das letzte Formularfeld ausgefüllt wurde.

Beispiel:

<form method="post">
<input name="nname" type="text" value="Name:" onkeydown="if(event.keyCode=='13') event.keyCode=9;"><br>
<input name="vname" type="text" value="Vorname:" onkeydown="if(event.keyCode=='13') event.keyCode=9;"><br>
<input name="email" type="text" value="Email:" onkeydown="if(event.keyCode=='13') event.keyCode=9;"><br>
<input type="submit" value="absenden">
</form>


Hinweis:
Dummerweise funktioniert das Script nur im Internet Explorer. Firefox- und Opera-User schicken das Formular weiterhin bei einem Druck der Enter-Taste unvollständig ausgefüllt ab.