Formular „gründen“

Wozu man Formulare braucht? Weiß ich auch nicht, aber mancher meint sie eben zu brauchen.
Formulare werden mit dem Tag <form> definiert bzw. erzeugt. Allerdings bleiben sie ohne Attribute so unexistent,  wie man sich Formulare nur wünschen kann.
Die für die Anlage eines Formulars erforderlichen Attribute legen vorab fest, was mit den Angaben, die das Formular einsammelt, passieren soll. Wenn das Formular nur intern zu verarbeitende Daten sammelt, können die Attribute zum <form>-Tag auch entfallen.

 
Die Definition eines Formulars zum Einsammeln und Verschicken von Daten würde also etwa so aussehen:

<form action=“mailto:myadress@myprov.de“ method=“post“ enctype=“text/plain“>
 <!– jetzt kommen die Tags, die das Formular mit Steuerelementen füllen –>
</form>

Der Abschickbefehl wird allerdings nur dann ausgeführt, wenn der Browser das prinzipiell kann und der E-Mail-Client ordnungsgemäß eingerichtet ist. Damit das Formular ein Formular wird, muß noch etwas geschehen, das Formular muß Steuerelemente erhalten.

Steuerelemente auf Formularen

Es gibt formal geredet genau drei Formular-Steuerelemente, nämlich Input-Elemente bzw. „Eingabefelder“, „Textareas“, die der Eingabe von längeren Texten dienen aber nicht zu den Eingabefeldern zählen, und „Listenfelder“, in denen man aus einer -was wohl?- richtig, einer Liste auswählt. Warum man Textareas nicht der Vielzahl der Input-Elemente hat zuschlagen können, verbirgt sich mir ebenso, wie die Frage, warum Auswahl aus einem Wahlangebot von Radio-Buttons eine Eingabe, aus einer Liste dagegen keine Eingabe sein soll.

Eingabefelder

Tag <input>, ohne schließendes Tag.
Das universelle Eingabefeld nimmt Klick-, Text- oder Zahleneingaben des Nutzers an. Angelegt wird es durch das <input>-Tag. Wie es aussieht und reagiert, wird mit Attributen festgelegt, die wie immer in der öffnenden Tag-Klammer angegeben werden müssen/können. Um die Anordnung des Eingabefeldes auf dem Formular muß sich der Seitenkomponist allerdings auch kümmern. Eingabefelder können wie alle anderen Elemente der Seite. Eingabefelder können wie alle anderen Elemente der Seite

• wie Fließtext behandelt werden; was von allein geschieht, wenn man sich um die Anordnung nicht kümmert, was … aussieht, oder
• man nutzt die üblichen Möglichkeiten der Anordnung z.B. mit dem <center>-Tag oder mit <div align=right/left> …</div>
• man baut sie zur örtlichen Fixierung in Tabellen oder Listen ein.

Übersicht der <input>-Typen

 
Beim Versenden des Formulars werden im E-Mail in der Reihenfolge der Formularelemente Zeilen der Form: „Name des Formularelements=value“ angelegt.
Dabei ist value der jeweilige Eintrag bzw. für Radio-Buttons der vorab vergebene value-Wert des ausgewählten Knopfs. Wenn man die Namen der Fomularelemente entsprechend vergibt, entsteht Klartext, der ohne weitere Probleme auswertbar ist.

Mehrzeiliges Eingabefeld: Textarea

Tag: <textarea>….</textarea>
Für die Eingabe längerer Texte, wie Briefe, komplette Anschriften etc. ist das Input-Feld vom Typ „text“ nicht geeignet. Mit dem Tag <textarea> wird Abhilfe geschaffen. Es hat wieder eine Reihe von Attributen, für die jeweils bei fehlender Angabe mehr oder wenige sinnvolle Default-Werte gelten. Nötig ist wieder für die spätere Auswertung der Name des Feldes.

 
Beispielcode:

<form>
<textarea name=“versuch“ rows=“5″ cols=“40″ wrap=“off“>meine textvorgabe</textarea>
</form>

Listenfeld

Tag <select>…</select> + <option>
Für die Auswahl unter mehreren Möglichkeiten gibt es das Auswahl- oder Listenfeld, ähnlich einfach einzurichten wie die anderen Steuerelemente. Die Einträge erfolgen mit dem <option>-Tag über das Attribut value. Beispiel folgt unten.

Die einzelnen Attribute sind:

 
Beispielcode:

<form>
<select name=“test“ size=“1″>
<option value=1>Äpfel
<option value=2>Birnen
<option value=3 selected>Pflaumen
</select>
<form>

Formulare auswerten

Solange man beim reinen HTML bleibt, sind Formulare ebenso leicht ausgewertet wie angelegt. Dafür hat man aber nur wenige Möglichkeiten.
Viel mehr Möglichkeiten hat man allerdings, wenn man mindestens JavaScript einsetzt. Für alle Steuerelemente können nämlich Ereignisse wie „onfocus“ (die Maus hat das Steuerelement erreicht), „onchange“ etc. ausgewertet werden, die dann die Abarbeitung eines „Scripts“, also einer Programmroutine starten.
Trotzdem hat es Sinn, die Möglichkeiten von Formularen innerhalb von HTML zu nutzen: Angaben von Lesern lassen sich leicht empfangen. Die Verschickung der Formulareinträge funktioniert wie oben gezeigt „automatisch“. Die Auswertung kann „von Hand“ erfolgen und erfordert dann keine weiteren Kenntnisse. Mit dem speziellen Protokoll CGI (Common Gateway Interface) können Formulareingaben des Nutzers als Argumente an ein Programm des  Servers übergeben werden, welches seine Ergebnisse an den Nutzer zurückschickt.

Formulartest / Meinungsäußerung zum Kurs

Hier folgt ein Testformular, das Wünsche an den Autor des Kurses übermittelt. Wenn Sie Ihre korrekte E-Mail-Adresse angeben, erhalten Sie per E-Mail eine Kopie dieses Schreibens. Daran können Sie überprüfen, was bei der Formularauswertung über Sie offenbart wird. Wenn Sie das nicht wollen, einfach die Adressangabe weglassen. Das Absenden einer Kopie an Ihre, eben erst eingetippte Adresse geht mit HTML allein nicht. Deshalb ist hier JavaScript eingearbeitet. Auf die mit JavaScript ebenfalls mögliche Testung der  Einträge habe ich hier allerdings verzichtet.