|
Formulare stellen dem Benutzer der Seite eine Reihe Eingabemöglichkeiten zur
Verfügung. Hat der Benutzer die Inhalte eingetragen, kann der Benutzer eine
Schaltfläche anklicken und den Inhalt an den Web-Server senden oder per E-Mail
verschicken. Häufig werden Formulare bei Suchdiensten eingesetzt, wo der
Benutzer in einem Eingabefeld Suchbegriffe eingeben kann, nach denen in einer
Datenbank gesucht werden soll. Außerdem werden Formulare beim
Online-Shopping oder als Eingabenmöglichkeit für Feedback an Firmen verwendet.
Das Erstellen von Formularen mit Frontpage stellt keine große Schwierigkeit
dar. Mit Hilfe von Assistenten oder Menübefehlen und Dialogen lassen sich
HTML-Seiten erstellen, die komplexe Formulare enthalten.
Die Befehle zum Einfügen von Formularelementen befinden sich im Menü Einfügen/Formular.
Wenn man dort das erste Formularfeld auswählt und einfügt, wird automatisch
auch der Code für das Formular selbst eingefügt. Es werden z.B. zwei
Schaltflächen eingefügt - eine zum Abschicken und eine zum Löschen des
Formularinhaltes. Frontpage erzeugt auch Standardcode zum Speichern des
Formularinhaltes. Dieser Code funktioniert jedoch nur, wenn auf dem Web-Server Frontpage-Servererweiterungen
(Frontpage Server Extensions) verfügbar sind. Da das oft nicht der Fall ist,
werden zunächst die wichtigsten Formulareigenschaften erklärt. Anschließend
werden einige Formularfelder beispielhaft vorgestellt.
Formulareigenschaften festlegen
Im HTML-Code wird ein Formular in die Tags <FORM> und </FORM>
eingeschlossen. Dem einleitenden Tag können eine Reihe von Attributen
hinzugefügt werden, die in der folgenden Tabelle zusammengefaßt sind.
Eigenschaften für Formulare
| Einstellung |
Beschreibung |
HTML-Tag |
| Formularname |
über den Formularnamen kann man sich auf das
Formular beziehen, z.B. in JavaScript-Code |
name="formularname" |
| Übertragungsmethode |
Legt die Art fest, wie Daten übertragen und
verarbeitet werden können |
method="get" oder method="post" |
| ausgeführte Aktion |
legt fest, was passiert, wenn der Benutzer
auf die Schaltfläche Abschicken klickt |
action="mailto:
user@host.com" oder action="script.cgi" |
| JavaScript-Events |
Werden bestimmte Aktionen im Formular
ausgeführt können automatisch Java-Skripte ausgeführt werden. |
onSubmit="programm" oder
onChange="programm" |
Die Frontpage erzeugten Formulare setzen voraus, daß man Servererweiterungen
für Frontpage installiert hat. Da das in vielen Fällen nicht der Fall sein dürfte, muß man als Designer von Formularseiten die oben angegebenen Attribute
selbst ändern. Wenn man Frontpage-Servererweiterungen auf dem Webserver
installiert hat, kann man die von einem Formularassistenten erzeugten Webseiten
in der Regel direkt verwenden.
Es gibt drei Möglichkeiten, Daten aus Formularen zu verarbeiten:
- Durch den Aufruf eines CGI-Scripts auf dem Webserver wird dort ein
Programm gestartet, das die Bearbeitung des Formularinhaltes übernimmt. Das
Programm kann in jeder Programmiersprache programmiert sein. Allerdings
werden meist Programme verwendet, die in der Sprache Perl geschrieben
wurden.
- Wenn als Methode Get verwendet wird, werden die Daten
des ausgefüllten Formulars auf WWW-Servern mit installiertem
HTTP-Protokoll in der CGI-Umgebungsvariablen
QUERY_STRING
gespeichert. Das CGI-Programm muß den Inhalt dieser
Umgebungsvariablen auslesen und verarbeiten.
- Wenn die Methode Post benutzt wird, werden die Daten des
ausgefü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.
- Man kann den Inhalt des Formulars per E-Mail versenden. In diesem
Fall muß die Methode auf "Post" (
method=post)
gesetzt werden. Als Aktion wird die E-Mail-Adresse als URL angegeben (z.B. action="mailto:user@host.com").
Browser, die kein E-Mail-Protokoll verarbeiten können, werden mit diesem
Formular nicht funktionieren.
- Seit einiger Zeit besteht die Möglichkeit, Servlets zu verwenden.
Servlets sind spezielle Java-Programme, die wie CGI-Programme auf dem
WWW-Server ausgeführt werden und die Formularbearbeitung vornehmen.
Servlets sind sicherer und benötigen wenig Ressourcen auf dem Server. Allerdings
benötigt man für Servlets auch Erweiterungen im WWW-Server.
Java-Skripte können benutzt werden, um Formulareingaben zu prüfen, ehe sie
verschickt werden. Dadurch kann unnötiges Versenden von Daten vermieden werden.
Formularfelder hinzufügen
Wir wollen nun das folgende Formular erstellen, das einige typisch verwendete
Elemente enthält.
- Um einen Formularbereich zu bekommen, wählen wir den Menüpunkt Einfügen/Formular/Einzeiliges
Textfeld. Wir haben nun einen gestrichelt umrandeten Formularbereich
mit den zwei Schaltflächen Abschicken und Zurücksetzen.
- Wir fügen nun die Überschrift und eine Tabelle mit 2 Spalten ein. Die
Tabelle soll unsichtbar sein. Wir verschieben das Textfeld in die zweite
Spalte der zweiten Zeile und geben "mein Alter" als Beschriftung
ein.
- Die Zelle in der zweiten Spalte der ersten Zeile teilen wir horizontal in
zwei Zeilen. In jede diesen Zellen fügen wir ein Optionsfeld über den
Menüpunkt Einfügen/Formular/Optionsfeld ein. Wir geben die
Beschriftungen für die Optionsfelder ein.
- In der dritten Spalte fügen wir mit Hilfe des Menüpunktes Einfügen/Formular/Dropdownfeld
ein Dropdownfeld ein. Außerdem legen wir die Beschriftung ein.
- In der fünften Zeile fügen wir die Beschriftung und das
Kontrollkästchen hinzu. Zum Einfügen des Kontrollkästchen wählen wir den
Menüpunkt Einfügen/Formular/Kontrollkästchen aus.
- In der sechsten Zeile geben wir die Überschrift für das Kommentarfeld
ein. in der Zeile 7 verbinden wir die zwei Zellen der Zeile zu einer Zelle
und fügen über den Menüpunkt Einfügen/Formular/Textfeld mit
Bildlauf ein.
Nun haben wir das Aussehen des Formulars festgelegt. Um eine Auswertung des
Formulars zu ermöglichen, müssen wir nun die Eigenschaften der einzelnen
Felder bearbeiten. Wichtig ist vor allem, daß wir den Felder ausdrucksvolle
Namen geben, um die Programmierung und Auswertung anschließend zu erleichtern.
Zum Bearbeiten der Formularfeldeigenschaften klicken wir mit der rechten
Maustaste jeweils auf das Formularfeld und wählen aus dem Kontextmenü den
Eintrag Formularfeldeigenschaften aus.
| Feld |
Einstellung |
Beschreibung |
| Optionsfelder |
Name der Gruppe: Geschlecht |
In einer Gruppe von Optionsfeldern darf nur
ein Feld aktiviert sein. Deshalb werden Optionsfelder zu Gruppen
zusammengefaßt |
| Wert: maennlich bzw. weiblich |
Die Gruppe der Optionsfelder gibt als wert
entweder maennlich oder weiblich zurück, je nach
gewählter Option. |
| Anfangszustand: nicht gewählt |
Eines der Optionsfelder kann standardmäßig
gewählt sein. |
| einzeiliges Textfeld |
Name: Alter |
Name des Textfeldes |
| Anfangswert: <keiner> |
Standardwert für dieses Feld |
| Breite (in Zeichen): 3 |
Legt die Breite des Textfeldes fest. |
| Dropdownfeld |
Name: aufstehen |
Name des Dropdownfeldes |
| Höhe: 1 |
Anzahl der angezeigten Zeilen, Wenn der Wert
größer als 1 ist, wird aus dem Dropdownfeld ein Listenfeld. |
| Mehrfachauswahl zulassen: nein |
selbsterklärend |
| Auswahlliste siehe weiter unten |
Die Elemente, die in dem Dropdownfeld
angezeigt werden. |
| Kontrollkästchen |
Name: speichern |
Name des Kontrollkästchens |
| Wert: ON |
ON = aktiviert, sonst deaktiviert |
| Option aktiviert gewählt |
Standardwert des Kontrollkästchens. |
| Textfeld mit Bildlauf |
Name: Kommentar |
Name des Textfeldes |
| Anfangswert. <keiner> |
Standardwert für dieses Feld |
| Breite (in Zeichen): 50 |
Anzahl der Zeichen je Zeile |
| Anzahl Zeilen |
Anzahl der Zeilen, die sichtbar sind. Der
Inhalt kann mehr als 5 Zeilen lang sein. |
Im Dropdownfeld kann man eine Auswahl verschiedener Werte angeben, aus denen der
Anwender einen (oder mehrere) Werte auswählen kann. Im Dialog für die Formularfeldeigenschaften
kann über die Schaltfläche Hinzufügen je ein neuer Wert zur
Auswahlliste hinzugefügt werden. Die Schaltfläche Ändern kann zum Editieren
der Auswahlmöglichkeiten benutzt werden. Außerdem kann die Reihenfolge der
Optionen geändert werden. Wird kein spezieller Wert für die einzelnen Optionen
angegeben, wird der angezeigte Text als Wert zurückgegeben. Diese Einstellung
wird über das Kontrollkästchen Wert angeben festgelegt werden.
Über die Schaltfläche Gültigkeit könnten für die meisten
Formularfelder eine Gültigkeitsüberprüfung vorgenommen werden. Allerdings
sind dazu wiederum Servererweiterungen für MS Frontpage notwendig.
Der HTML-Code für das Formularfeld ohne den Code für die Tabelle sieht wie
folgt aus.
<form method=post action="mailto:user@host.com"
enctype="text/plain" name="eingabe">
<p><b><font size="4">So bin ich...</font></b></p>
<p>
<b>mein Geschlecht</b>
männlich <input type="radio" value="maennlich"
name="Geschlecht">
weiblich <input type="radio" value="weiblich"
name="Geschlecht">
<b>mein Alter:</b>
<input type="text" name="Alter" size="3">
<b>ich bin eher</b>
<select size="1" name="aufstehen">
<option selected>treffen Sie eine Auswahl</option>
<option value="Frühaufsteher">Frühaufsteher</option>
<option value="Langschläfer">Langschläfer</option>
</select>
<b>Daten dürfen gespeichert werden</b>
<input type="checkbox" name="speichern" value="ON" checked>
<b>weitere Bemerkung</b>
<textarea rows="5" name="Kommentar" cols="50"></textarea>
</p>
<p>
<input type="submit" value="Abschicken" name="submit">
<input type="reset" value="Zurücksetzen" name="reset">
</p>
</form>
|
In diesem Fall wird der Inhalt des Formulars per E-Mail verschickt.
|