Formular auf Korrektheit überprüfen

von Delite | 05.06.2007 um 21:24 h

Typ: Javascript Anwendungen
Stufe:Mittel

In diesem Tutorial zeige euch wie man mit JavaScript prüfen kann ob die Felder eines Formulares richtig ausgefüllt worden sind.
Ihr solltest aber beachten, wenn ihr die Daten nochmal mit PHP auswertet nicht auf Abfragen verzichtet wie ob der Name leer ist also ich fang mal an <3
HIER findet ihr das Beispiel.

<html>

	<head>

		<title>Beispiel</title>

		<script language="JavaScript">

			<!--

			function Pruefen()

			{

				if(document.Register.name.value != "" && document.Register.passwort1.value != "" && document.Register.passwort1.value == document.Register.passwort2.value) { // Bedingungen, die wahr sein müssen zum Verschicken

					return true; // Schickt Formular ab

				} else {

					alert("Fehler bei der Registrierung!"); // Fehlermeldung

					return false; // Schickt formular nicht ab

				}

			}

			//-->

		</script>

	</head>

	<body>

		<center><br><br>

			<form action="tutorials/124_1.html" method=post onSubmit="return Pruefen()" name="Register">

				<table width=50%>

					<tr>

						<td width=50%>

							<b>Name:</b>

						</td>

						<td width=50%>

							<input type="text" name="name">

						</td>

					</tr>

					<tr>

						<td width=50%>

							<b>Passwort:</b>

						</td>

						<td width=50%>

							<input type="password" name="passwort1">

						</td>

					</tr>

					<tr>

						<td width=50%>

							<b>Passwort Wiederholung:</b>

						</td>

						<td width=50%>

							<input type="password" name="passwort2">

						</td>

					</tr>

				</table>

				<input type="submit" value="Abschicken">

			</form>

		</center>

	</body>

</html>

Mit der Funktion Pruefen() wird abgefragt welche Werte wie sein sollten, um das Formular abzuschicken. Eine Variable aus dem Formular kann man so aufrufen:
document.Register.name.value

Register
ist der name des Formularea in <form>-Tag das name=""

name
ist der Name des Formular-Feldes bsp: <input name="bla">

Ihr könnt diese If-Abfrage nach Lust und Laune ändern sowie das Formular.
mit onSubmit="return Pruefen()" wird dann die Funktion aufgerufen. Man gibt zurück ob das Formular abgeschickt werden soll oder nicht und zwar in der Funktion mit return true oder false.

So ich hoffe, euch gefällt dieses Tutorial. Ein ähnliches Skript verwende ich auch bei der Registrierung auf Giatu ;)

4 Kommentare

ahh,... des geht auch mit javascript? ich habs immer mit php gemacht >_> aer delite machts wieder eifnacher *lach*

am 05.06.2007 um 21:38 Uhr

Delite

man sollte schon mit php das ganze abfragen lassen aber ich glaub man muss keine fehlermeldungen mit php anzeigen lassen, das übernimmt ja jetzt JS ^^

am 05.06.2007 um 21:45 Uhr