Formulare

Dieses Kapitel ist vor allem wichtig, wenn man dynamische Webseiten erstellen will. Formulare ermöglichen es Eingabedaten an eine Skriptdatei, wie zum Beispiel ein PHP-Skript (es gibt noch andere), zu schicken und die Daten dort auszuwerten.

Aufbau

Ein Formular wird vom form-Tag umfasst:

<form method="post" action="skript.php">
    <!-- Formular hier -->
</form>

Dieses form-Tag beinhaltet in der Regel diese zwei Attribute, kann aber auch noch andere enthalten:

method Beschreibt die Methode, also die Art, wie die Daten geschickt werden. Es kann im Allgemeinen 2 Werte annehmen, nämlich „get“ und „post“ (siehe unten).
action Gibt das Skript an, an was die Daten geschickt werden sollen. Das heißt hier werden die Eingabedaten des Nutzers an die Datei „skript.php“ geschickt, die im gleichen Verzeichnis liegt, wie die HTML-Datei des Formulars.

Das alleine reicht allerdings noch nicht aus, damit überhaupt Daten eingegeben werden können, denn der Nutzer sieht keine Eingabeboxen auf der Webseite. Diese Eingabeboxen werden mithilfe des input-Tags definiert. So könnte ein Eingabefeld aussehen:

<input type="text" name="usrname" size="40" value="Benutzername">

Diese Zeile gibt also ein Texteingabefeld an, welches den Namen „usrname“ trägt (was vor allem wieder für die Leute wichtig ist, die mit den Daten weiterarbeiten wollen), und das Eingabefeld hat die Größe 40 (das heißt die Breite ist 40 Einheiten groß). Wichtig sind die Attribute type und name. Type gibt an, welcher Art das Eingabeelement ist, und limitiert somit auch die Benutzung des Feldes (z.B. können Checkboxen nur bool'sche Werte übergeben). Es gibt aber nicht nur Texteingabefelder, hier also eine Übersicht über die wichtigsten Elemente eines Formulars:

Name Code Beispiel Bemerkung
Texteingabefeld
<input type="text" name="usrname" value="Benutzername">
Ein gewöhnliches einzeiliges Texteingabefeld
Passworteingabefeld
<input type="password" name="pass" value="Passwort">
Das Passworteingabefeld stellt alle Zeichen als Sterne bzw. Punkte dar, sodass sie nicht gelesen werden können. Beim Übermitteln werden die Zeichen aber nicht verschlüsselt!
Auswahlboxen/-felder
<select name="select" size="1">
<option value="1">1</option>
<option value="2" selected>2</option></select>
Die Auswahlbox, die die size 1 besitzt, ist ein normales Dropdown-Menü. Diese Box kann nur 2 Werte annehmen, wovon der Wert „2“ vorselektiert ist (durch den Zusatz „selected“)
Checkbox
<input type="checkbox" name="check" value="ja">Ja
Ja Eine Checkbox ist ein Feld, was angekreuzt werden kann. Diese ist mir „Ja“ beschriftet und übergibt den Wert „ja“. Wichtig ist, die Beschriftung dahinter anzugeben.
Textfeld
<textarea cols="10" rows="2" name="textfeld">Ein mehrzeiliges Textfeld</textarea>
Ein mehrzeiliges Textfeld. Dieses besitzt 10 Spalten (cols=„10“) und erstreckt sich über 2 Zeilen (rows=„2“). Der Standardtext wird zwischen den 2 textarea-Tags angegeben.
Knopf
<input type="submit" name="submit" value="Abschicken">
Ein Knopf zum Absenden (submit) der Daten des Formulars. Durch betätigen des Knopfes wird das Formular zum Skript geschickt.
Dateifeld
<input type="file" name="pic">
Hier kann eine Datei zum Hochladen ausgewählt werden, bitte beachten Sie dabei unbedingt die unter Dateiuploads ausgeführten Bemerkungen.

Methods

Wie oben erwähnt kann das Attribut method im form-Tag die zwei Werte post und get annehmen. Der Unterschied ist folgender: wird ein PHP-Skript aufgerufen, wird das beispielsweise folgendermaßen gemacht: http://www.proggen.org/forum/viewtopic.php?f=34&t=4954 . Man bemerkt nun also, dass nicht nur die Datei viewtopic.php aufgerufen wird, sondern dass danach ein „?“ folgt und Parameter übergeben werden (hier handelt es sich beispielsweise um Angaben über das Forum und über den Thread, der vom Skript zu laden ist). Diese Form der Parameterübergabe - also über die im Browser gezeigt URL - ist der Weg über get. Alle Eingaben werden bei method=„get“ also in der Adressleiste im Browser für jeden sichtbar angezeigt. Das betrifft auch Passwörter, die in einem Passworteingabefeld als Sterne angezeigt werden. Der Weg über post zeigt die Eingaben nicht an, sie werden aber trotzdem nicht verschlüsselt. Sie sind lediglich nicht für jeden, der auf die Adressleiste schauen kann, sichtbar.

Beispiele

Loginformular

Ein Loginformular verlangt im Normalfall die Angabe eines Benutzernamen und eines Passwortes. Das Passwort soll bei der Eingabe natürlich niemand lesen können, sondern nur aus Punkten bzw. aus Sternen „bestehen“.

<form method="post" action="doesnotexist.php">
<p>Benutzername: <input type="text" name="benutzername" value="" size="40"></p>
<p>Passwort: <input type="password" name="passwort" value="" size="40"></p>
<input type="submit" name="submit" value="Einloggen">
</form>

Das sieht in etwa so aus:

Benutzername:

Passwort:

Dateiuploads

Wichtig beim Hochladen von Dateien ist, dass im form-Tag ein weiteres Attribut namens „enctype“ mit dem Wert „multipart/form-data“ gefüttert wird, damit das Hochladen der Datei angenommen wird.

<form method="post" action="doesntexisteither.php">
<p>Datei: <input type="file" name="pic"></p>
<input type="submit" name="submit" value="Bild hinzufügen">
</form>

Datei:

Im nächsten Kapitel kümmern wir uns um die Formatierung von Text.