Formulare bieten die Möglichkeit, den Benutzer
am Bildschirm Daten eingeben zu lassen, die
dann in eine Variable geschrieben werden. Die
Variable wird nach dem "CGI-BIN" - Standard
an den WWW-Server geschickt und von diesem an
ein Programm weitergegeben, das sie bearbeitet.
Solche Programme sind betriebssystemabhängig
und normalerweise nicht oder nicht ohne Anpassung
portabel. Daher möchte ich darauf hier nicht
näher eingehen, ein WWW-Server-Betreiber sollte
sich nach geeigneten Programmen für das Betriebssystem
seines Servers umsehen bzw. welche schreiben.
Beliebte Anwendungsfälle
für Formulare sind Gästebücher, Feedback-Seiten
(die eingegebene Rückmeldung geht per Mail zum
Ersteller), Suchmaschinen, Datenbankgateways
und interaktive Programme.
Ein HTML-Formular beginnt man mit
<FORM>
und beendet es mit
</FORM>.
Dabei gibt das Attribut
ACTION
an, mit welchem Programm das Formular Daten
austauschen soll. Das Programm wird mit Hilfe
einer URL bestimmt. Allerdings muss, der Server
das Programm als CGI-Applikation erkennen. Dies
geschieht, indem entweder alle CGI-Programme
in einem speziellen Verzeichnis liegen oder
eine bestimmte Endung haben. Sprechen Sie darüber
mit Ihrem Server-Administrator. Sie können auch
CGI-Programme auf fremden Servern mit eigenen
Formularen ansprechen. Dies kann z. B. bei Suchmaschinen
sinnvoll sein, um lange Ladezeiten zu vermeiden.
So lässt sich etwa mit
<form action="http://www.leo.org/cgi-bin/aliwebform.pl">
der deutsche Spiegel der Aiweb-Datenbank ansprechen.
Wenn Sie die in das Formular eingegebenen Daten
nur per Mail verschicken wollen, können Sie
auch ohne CGI-Programm auskommen, indem Sie
den Befehl
<form action="mailto:Mailadresse">
verwenden. Das Attribut
METHOD
bestimmt, ob das Programm Informationen aus
dem Formular erhält (METHOD=GET,
wird auch verwendet, wenn das Element
METHOD
fehlt) oder ob das Programm einen Transfer auf
den Bildschirm des Benutzers durchführen soll
(METHOD=POST,
so kann man etwa mit einer Kommandozeile eine
Datenbankabfrage durchführen). Das Attribut
ENCTYPE
bestimmt, wie die Datenübertragung kodiert werden
soll. Ist kein Wert angegeben, wird application/x-www-form-urlencoded
verwendet.
Eingabe
von Daten
Eingabefelder
werden mit dem Befehl
<INPUT>
erstellt. Das Element
NAME
gibt dabei den Namen der Variablen an, in die
geschrieben werden soll. Es gibt verschiedene
Typen von Eingabefeldern:
<INPUT
TYPE=TEXT>
erstellt ein einzeiliges Texteingabefeld.
SIZE
gibt die Größe in Buchstaben an,
MAXLENGHT
die Anzahl der maximal eingebbaren Buchstaben
und
VALUE
den vorgegebenen Wert. Beispiel:
<INPUT TYPE=TEXT NAME="x" SIZE=70 VALUE="Vorgabe">
ergibt
<INPUT
TYPE=PASSWORD>
macht das gleiche wie
TYPE=TEXT,
stellt die Eingabe am Bildschirm jedoch
als Sternchen dar. Aber Vorsicht: Die
Eingabe wird im Klartext an den WWW-Server
geschickt! Für Passworteingaben eignet
es sich also nicht.
<INPUT
VALUE=CHECKBOX>
erlaubt dem Benutzer die Auswahl eines
bestimmten Wertes mit Hilfe eines anklickbaren
Kästchens. Lässt man dem Benutzer mehrere
Kästchen zur Auswahl, so kann er auch
mehrere gleichzeitig anklicken.
VALUE
bestimmt hier den Wert, der übermittelt
wird, wenn das jeweilige Kästchen angeklickt
wird.
CHECKED
gibt an, dass dieses Kästchen als Vorgabe
bereits angeklickt ist. Beispiel:
Die
Ausgabe im Browser:
<INPUT
TYPE=RADIO>
erzeugt einen anklickbaren Kreis mit
den gleichen Eigenschaften wie
CHECKBOX,
nur dass bei mehreren Buttons nur einer
gleichzeitig angeklickt werden kann.
<INPUT
TYPE=HIDDEN>
erlaubt die Eingabe eines Wertes, ohne
daß der Benutzer ihn beeinflussen könnte.
Dies ist beispielsweise bei Mail-Formularen
nützlich, die auf ein gemeinsames MailTo-Programm
zugreifen, aber jeweils nur an eine
bestimmte Person Mail verschicken sollen.
Hier kann man die Empfängeradresse per
HIDDEN
fest vorgeben.
<INPUT
TYPE=SUBMIT>
generiert einen Knopf, der, wenn er
gedrückt wird, die Datenübertragung
auslöst.
VALUE
bestimmt dabei die Aufschrift des Knopfes.
Man kann ihn etwas breiter machen, indem
man zwischen " und Buchstaben Platz
lässt. Beispiel:
<INPUT TYPE=SUBMIT
VALUE=" OK ">
ergibt:
<INPUT
TYPE=RESET>
stellt dagegen einen Knopf dar, der,
wird er gedrückt, das Formular zurücksetzt.
VALUE
bestimmt auch hier die Aufschrift.
Beispiel:
<INPUT TYPE=RESET
VALUE=" Abbrechen ">
ergibt:
<INPUT
TYPE=IMAGE>
erstellt ein Submit-Icon, das genau
wie ein Submit-Knopf funktioniert. Mit
SRC=
wird die URL der Grafik bestimmt und
mit
ALIGN
kann das Icon
wie ein
Bild im Text angeordnet werden.
Von solchen Submit-Icons ist aber abzuraten,
weil sie zu Problemen mit textbasierten
Browsern führen. Beispiel:
<INPUT
TYPE=IMAGE SRC="welt.gif">
ergibt:
<INPUT
TYPE=FILE>
ermöglicht es, Name und Pfad einer lokalen
Datei per Formular abzufragen. Der Benutzer
bekommt ein Textfeld zum Eintragen des
Pfades und alternativ einen Knopf zum
Aufruf eines Dateibrowsers angezeigt.
Mit
SIZE
und
MAXLENGHT
kann man die Größe des Eingabefeldes
bestimmen (siehe
<INPUT TYPE=TEXT>).
Beispiel:
<INPUT TYPE=FILE
NAME="file">
ergibt:
Weitere
Eingabefelder ohne
INPUT
(auch hier bestimmt
NAME
die Variable):
<TEXTAREA>
erstellt ein größeres Eingabefeld, in
das auch mehrere Zeilen Text eingegeben
werden können. Dabei gibt
ROWS
die Anzahl der Zeilen und
COLS
die Breite in Buchstaben an.
<TEXTAREA>
wird mit
</TEXTAREA>
abgeschlossen. Dazwischen kann Text
stehen, der als Vorgabe in dem Eingabefeld
stehen soll. Beispiel:
Die Ausgabe im Browser:
<SELECT>
erstellt eine "Pull-Down-Box" zum direkten
Anklicken eines bestimmten Wertes.
<SELECT>
wird durch
</SELECT>
abgeschlossen, dazwischen stehen die
Auswahloptionen. Diese werden mit
<OPTION
VALUE= >
erstellt, wobei
VALUE
den Wert festlegt. Hinter
<OPTION
steht der Text, den der Benutzer zu
Gesicht bekommt. Fehlt
VALUE,
wird der Begriff hinter
<OPTION>
benutzt. Dort darf dann aber nur ein
Wort stehen!
SELECTED
bestimmt die Vorgabe. Standardmäßig
ist nur eine Option (die Vorgabe) auf
den ersten Blick zu sehen, die anderen
bei Anklicken. Mit
SIZE
kann jedoch die Zahl der sichtbaren
Optionen bestimmt werden - bis hin zu
allen.
Das Attribut
MULTIPLE
erlaubt die gleichzeitige Anwahl mehrerer
Punkte. Beispiel:
