Forgot your password?
Formulare
In diesem Kapitel werden Sie lernen, wie Formulare genau aufgebaut sind, und was es für Elemente für Formulare gibt. Doch am Schluss können Sie die Werte des Formulars noch nicht weiterverwenden. Wie Sie die Daten genau auswerten können, lernen Sie im Kapitel PHP beim Unterkapitel Formulare/E-Mails.
Formulare sind im Internet ein sehr wichtiges Mittel um Informationen zu versenden und anschliessend auszuwerten. Der Grundaufbau eines Formulares fängt an mit <form name="NAME" action="AKTION" method="METHODE" enctpy="FORMAT">. Mit "NAME" kann irgend ein Name an das Formular vergeben werden. Diesen braucht man dan später um Informationen per JavaScript zu setzten. Mit "AKTION" wird definiert, was mit den Daten genau passieren soll, wenn der Benutzer auf die Schaltfläche senden klickt. Z.Bsp. kann man das ganze per Mail versenden (action="mailto:info@wyden.eu") oder mit einer PHP-Datei verknüpfen. Mit "METHODE" definiert man die Methode. Man unterscheidet zwischen "post" und "get" Mehoden. Mit "get" versendet man die Informationen über die URL, mit "post" wird das ganze im Geheimen übetragen. Schlussendlich kann man noch das "FORMAT" festlegen. Dies kann normaler Text ("text") oder die URL einer Datei ("multipart/form-data") sein.
| <form name"formular" action="senden.php" method="get" enctype="text"> Inhalt des Formulars </form> |
Ein einzeiliges Eingabefeld wird mit folgendem Befehl eingeführt:
| <input type="text" name="FELDNAME" size="GRÖSSE" maxlength="LÄNGE" value="TEXT" readonly> |
Mit "FELDNAME" wird der Name des Feldes definiert, mit "Grösse" die Grösse des Feldes, mit "LÄNGE" die maximale Eingabelänge und mit "TEXT" der Text der im Feld am Anfang steht. Wenn der Befehl readonly vorhanden ist, ist es dem Benutzer nur erlaubt den Text im Feld zu lesen, aber nicht zu schreiben.
Ein Passwortfeld ist eigentlich gleich wie ein Einzeiliges Eingabefeld, einfach mit dem Unterschied, dass bei der Eingabe nur Sterne erscheinen und nicht der Text.
| <input type="password" name="FELDNAME" size="GRÖSSE" maxlength="LÄNGE"> |
Als erweiterung des Einzeilgen Eingabefeldes gibt es auch die sogennante Textbox. Mit rows="WERT" kann man die Anzahl Zeilen und mit cols="WERT" kann man die Anzahl Zeichen pro Zeile definieren. Ebenso gilt hier auch de Befehl readonly.
| <textarea name="FELDNAME" rows="WERT" cols="WERT" readonly>TEXT</texarea> |
Die Auswahlliste kann man mit dem Befehl select einleiten. Mit dem Zusatzbefehl multiple erlaubt man die Auswahl mehrerer Einträge.
Die einzelnen Einträge der Liste werden mit option eingeleitet. Mit value="TEXT" legt man den Variablennamen für die spätere Auswertung fest und wenn selected gesetzt ist, ist dieser Eintrag am Anfang ausgewählt.
| <select name="FELDNAME" size="WERT" multiple> <option value="NAME">1. Eintrag</option> <option value="NAME" selected>2. Eintrag</option> </select> |
Ein Kontrallkästchen kann man mit dem Befehl type="checkbox" erzeugen. Mit name="NAME" setzt man den Namen des Elements fest und mit value="WERT" setzt man den Wert zum Auswerten des Feldes fest. Mit der Attribute checked legt man die Vorauswahl eines Elements fest.
| <input type="checkbox" name="NAME" value="WERT"> <input type="checkbox" name="NAME" value="WERT" checked> |
Mit Hilfe des Optionsfelds kann der Benutzer eine Auswahl treffen. Eingeleitet wird das ganze mit dem Befehl input type="radio". Mit name="NAME" wird der Name der Optionsfelder ausgewählt. Dieser muss der gleiche sein für alle Optionsfelder die zusammenhängen. Die anderen Befehlen sind eigentlich gleich wie bei den Kontrollkästchen.
| <input type="radio" name="NAME" value="WERT"> <input type="radio" name="NAME" value="WERT" checked> |
Versteckte Felder kann man brauchen, um Informationen versteckt zu versenden, ohne dass dies der Benutzer visuell sieht. Mit value="WERT" wird einfach der Wert für die Übergabe des Feldes definiert.
| <input type="hidden" name="NAME" value="WERT"> |
Zum Schluss eines Formulars kommen immer die Schalflächen zum versenden oder löschen des Formulars. Eingeleitet wird der senden Befehl mit input type="submit", mit value="TEXT" setzt man den Text der Schaltfläche fest. Die Schaltfläche zum Löschen ist identisch, ausser dass type="reset" steht.
| <input type="submit" value="TEXT"> <input type="reset" value="TEXT"> |
Man kann auch ein Bild als Schaltfläche nehmen. Dann definiert man das ganze mit
type="image"und mit
src="URL"setzt man den Pfad zum Bild fest.
<input type="image" name="NAME" src="URL">
