SELFHTML: HTML / Formulare / Formulare definieren
Description: (SELFHTML 7.0) Wie Sie in HTML Formulare definieren, und wozu Formulare da sind.
Keywords: SELFHTML, HTML, Formulare

SELFHTML/Quickbar HTML Formulare

| ## Formulare definieren
| Allgemeines zu Formularen Formular definieren Zielfenster für Server-Antwort bei Frames Weitere Möglichkeiten

## Allgemeines zu Formularen

HTML stellt die Möglichkeit zur Verfügung, mit Hilfe spezieller Befehle Formulare zu erstellen. In Formularen kann der Anwender Eingabefelder ausfüllen, in mehrzeiligen Textfeldern Text eingeben, aus Listen Einträge auswählen und Buttons anklicken. Wenn das Formular fertig ausgefüllt ist, kann der Anwender auf einen Button klicken, um das Formular abzusenden.

Dazu geben Sie beim Erstellen eines Formulars an, was mit den Daten des ausgefüllten Formulars passieren soll. Sie können sich die ausgefüllten Daten beispielsweise per E-Mail zuschicken lassen oder von einem CGI-Programm auf dem Server-Rechner weiterverarbeiten lassen.

Formulare können sehr unterschiedliche Aufgaben haben. So werden sie zum Beispiel eingesetzt:

- um bestimmte, gleichartig strukturierte Auskünfte von Anwendern einzuholen,
- um Anwendern das Suchen in Datenbanken zu ermöglichen,
- um Anwendern die Möglichkeit zu geben, selbst Daten für eine Datenbank beizusteuern,
- um dem Anwender die Möglichkeit individueller Interaktion zu bieten, etwa um aus einer Produktpalette etwas Bestimmtes zu bestellen.

Ein Software-Hersteller könnte z.B. ein Formular zur Verfügung stellen, in dem der Anwender angeben kann, welche Produkte der Firma er besitzt, wie er Kenntnis von den Produkten erhalten hat, welchen Beruf er ausübt, auf welchem Rechnertyp die Software bei ihm läuft usw. Auf diese Weise könnte er gleichartig strukturiertes und daher gut vergleichbares Feedback von Anwendern einholen.

Viele Suchdienste im Internet bieten dem aufrufenden WWW-Browser in HTML geschriebene Eingabe-Formulare an, in denen der Anwender seinen Suchwunsch spezifizieren kann. Ohne solche Formulare wäre das Durchsuchen gar nicht möglich. Die meisten Suchdienste bieten darüber hinaus auch die Möglichkeit an, eigene Internet-Adressen in die Datenbank einzuspeisen. Das Einholen der dazu nötigen Information geschieht ebenfalls mit Hilfe von Formularen.

Immer zahlreicher werden auch die Bestell-Services im Internet. Egal ob Tickets, Pizza oder Unterwäsche - um solche Bestell-Services zu realisieren, sind Formulare erforderlich, in denen der Anwender seine Bestellwünsche genau angeben kann.

Wenn Sie dem Anwender auf Ihren WWW-Seiten einfach nur eine Möglichkeit anbieten wollen, direkt mit Ihnen in Kontakt zu treten, genügt allerdings auch ein einfacher E-Mail-Verweis an die eigene Email-Adresse.

## Formular definieren

Anzeigebeispiel: So sieht's aus

Sie können an einer beliebigen Stelle innerhalb des Dateikörpers einer HTML-Datei ein Formular definieren.

### Beispiel 1:

    <form action="mailto:muenz@csi.com" method=post enctype="text/plain">
    ... Elemente des Formulars wie Eingabefelder, Auswahllisten, Buttons usw. ...
    </form>

### Beispiel 2:

    <form action="/cgi-bin/auswert.pl" method=get>
    ... Elemente des Formulars wie Eingabefelder, Auswahllisten, Buttons usw. ...
    </form>

### Erläuterung:

Mit `<form ...>` definieren Sie ein Formular (form = Formular). Alles, was zwischen diesem einleitenden Tag und dem abschließenden Tag `</form>` steht, gehört zum Formular. Das sind hauptsächlich Elemente des Formulars wie Eingabefelder, Auswahllisten oder Buttons. Um die Elemente zu plazieren, brauchen Sie jedoch auch Textabsätze (Absatzschaltungen) und erzwungene Zeilenumbrüche. Darüber hinaus können Sie zwischen `<form...>` und `</form>` auch Text eingeben und diesen Text wie üblich mit HTML-Befehlen formatieren. Auch Grafiken, Verweise, Tabellen, Multimedia-Elemente sind mitten im Formular erlaubt. So können Sie Ihr Formular optisch aufwerten und mit erklärendem Text usw. versehen.

Im einleitenden `<form>`-Tag geben Sie mit `action=` an, was mit den ausgefüllten Formulardaten passieren soll, wenn der Anwender das Formular abschickt (action = Aktion). Die Angabe sollte in Anführungszeichen stehen.

Die Angabe bei `action=` ist entweder eine E-Mail-Adresse (normalerweise Ihre eigene) mit vorangestelltem `mailto:` - so wie im ersten der obigen Beispiele (mailto = sende an). Dann werden die ausgefüllten Formulardaten an diese E-Mail-Adresse geschickt.
Oder Sie rufen ein Programm auf dem Server-Rechner, meistens ein CGI-Programm, auf, das die Daten weiterverarbeitet - so wie im zweiten der obigen Beispiele. Bei der Adressierung des CGI-Programms gelten die gleichen Regeln wie bei Verweisen.
Weitere Hinweise hierzu in den Abschnitten Formulare als E-Mail und Formulare und CGI.
Allgemeines zum Thema CGI finden Sie außerdem im Abschnitt CGI - Common Gateway Interface. Und schließlich enthält dieses Dokument eine einführende CGI/Perl-Dokumentation.

Bei der Formulardefinition müssen Sie als nächstes die Übertragungsmethode angeben. Dabei gibt es zwei Möglichkeiten:

- Wenn Sie `method=get` wählen, werden die Daten des ausgefüllten Formulars auf WWW-Servern mit installiertem HTTP-Protokoll in der CGI-Umgebungsvariablen QUERY_STRING gespeichert (method = Methode, get = bekommen). Das CGI-Programm muß den Inhalt dieser Umgebungsvariablen auslesen und verarbeiten.
- Wenn Sie `method=post` wählen, werden die Daten des augefüllten Formulars auf dem Server-Rechner von "stdin" zur Verfügung gestellt, und das CGI-Programm muß sie behandeln wie eine Benutzereingabe, die auf der Kommandozeile gemacht wurde (post = verschicken). Da in diesem Fall kein EndOfFile-Signal (EOF) gesendet wird, muß das CGI-Programm die CGI-Umgebungsvariable CONTENT_LENGTH auslesen, um die Länge der übermittelten Daten und damit deren Ende zu ermitteln.

Wenn Sie sich Formulardaten per E-Mail zuschicken lassen, benutzen Sie immer `method=post`. Außerdem sollten Sie bei E-Mail-Empfang von Formulardaten immer die Angabe `enctype="text/plain"` mit angeben. Denn Formulardaten sind normalerweise nach einem bestimmten Schema formatiert, das für auswertende Programme recht gut geeignet ist, aber für Menschen keine Freude zu lesen ist. Mit der genannten Angabe erhalten Sie zumindest von Anwendern, die Ihr Formular mit einem modernen WWW-Browser ausfüllen, ordentlich formatierte E-Mails.

### Beachten Sie:

Nicht alle Browser beherrschen das Versenden von Formularen per E-Mail (mehr dazu siehe Formulare auswerten).

## Zielfenster für Server-Antwort bei Frames

Anzeigebeispiel: So sieht's aus

Wenn Sie mit Frames arbeiten und in einem Frame-Fenster ein Formular haben, nach dessen Absenden die Server-Antwort (zum Beispiel die Ausgabe eines CGI-Scripts) in einem anderen Frame-Fenster angezeigt werden soll, können Sie das Zielfenster für die Server-Antwort angeben.

### Beispiel:

    <form action="/cgi-bin/auswert.pl" method=post target="Daten">
    ... Elemente des Formulars wie Eingabefelder, Auswahllisten, Buttons usw. ...
    </form>

### Erläuterung:

Mit dem Attribut `target=` können Sie im einleitenden `<form>`-Tag den Namen des Frame-Fensters angeben, in dem die Server-Antwort ausgegeben werden soll. Sowohl Netscape als auch der MS Internet Explorer interpretieren diese Angabe.

## Weitere Möglichkeiten

Mit Hilfe von JavaScript können Sie Eingaben in Formularen steuern und kontrollieren. Bereits im einleitenden `<form>`-Tag ist der JavaScript- Event-Handler `onSubmit=` erlaubt. Beachten Sie dabei auch das JavaScript-Anwendungsbeispiel Formulareingaben überprüfen, bevor das Formular abgesendet wird.

Das `<form>`-Tag kann Universalattribute enthalten.

Wenn Sie HTML bereits etwas besser kennen, probieren Sie auch mal die Möglichkeiten aus, die Ihnen CSS Style-Sheets bieten. Damit können Sie Formulare zusätzlich formatieren. Zunächst müssen Sie dazu wissen, wie man Style-Sheets definieren kann. Anschließend sind Sie in der Lage, Style-Sheet-Angaben anzuwenden. Interessant sind im hier beschriebenen Zusammenhang beispielsweise folgende Style-Sheet-Angaben:
Abstände, Ränder, Ausrichtung
Rahmen und Innenabstände
Hintergrundfarben und -bilder

weiter: | Einzeilige Eingabefelder
zurück: | Browser-interne Grafik-Ressourcen

SELFHTML/Quickbar HTML Formulare

© 1998 Stefan Münz, muenz@csi.com