Auswahl-, Eingabeformulare (HTML-Notizen)

Überholungsbedürftig

9. Auswahl-, Eingabeformulare

Achtung: Die folgenden Formular-Routinen werden vom Browser IE 2.0 nur dann aufgebaut, wenn man ihm dazu Zeit läßt. Die Sanduhr, die den Ladevorgang anzeigt, mag schon verschwunden sein, aber es kann sein, daß der Browser noch lädt. Ab den Fassungen 3.0 scheint es keine Probleme mehr zu geben.

Formulare bestehen aus Eingabe- und Auswahlfeldern, mit denen Daten weitergeleitet werden können (in Dateien oder über das Internet zu anderen PCs).

Eingabefeld, einzeilig: <input size=y maxlength=z>

Verwendung: Definierte Feldeingaben (wie Datenbankeingaben).

size=Länge des Feldes (bemessen auf der Grundlage eines Zeichens wie "a", size=100 bedeutet also 100 mal "a")
maxlength=Maximale Anzahl beliebiger Zeichen, die eingegeben werden können.

Beispiel: size=100 maxlength=10

Beispiel: size=10 maxlength=20

Eingabefeld, mehrzeilig: <textarea cols=x rows=y></textarea>

Verwendung: Freie Eingaben (Bemerkungen, längere Mitteilungen, Freitext)

cols=Anzahl der Kolumnen (bemessen auf der Grundlage eines Zeichens wie "a", cols=50 bedeutet also 50 mal "a")
rows=Anzahl der Reihen (rows=10 bedeutet 10 Reihen)

Eingabefeld für einen größeren Text. Beispiel: cols="50" rows="10". Die Texteingabe ist nicht begrenzt.

Definierte Feldeingaben: <formaction=Zieladresse method=" "> <input type=" " name=" " size=x maxlength=y>

Anwendung: Übertragung von definierten Daten (Beispiel siehe weiter unten)

form action=Zieladresse (Dateipfad, Internetadresse, mailto:E-Mail-Adresse)

method=post (Übertragung nach einer Standardmethode)
method=get (Übertragung mit dem angeforderten QUERY_STRING)

type=text (Es wird ein Text übergeben.)
type=password (Es wird ein Paßwort übegeben.)
type=int (Es werden ganze Zahlen übergeben.)
type=float (Es werden Dezimalzahlen übergeben.)
type=date (Es wird ein Datum übergeben.)
type=url (Es wird eine Internetadresse übergeben.)

NAME=Bezeichnung des Feldes (Beliebiger Feldname, Benutzer, Absender etc.)

Einfaches Auswahlfeld: <select name=" " size=x> <option> ... </select>

NAME=Bezeichnung des Feldes (z.B. Musiker)
<Option>Angezeigte Spezifikation (z.B. Prez)
size=Anzahl der angezeigten Optionen.

Wälen Sie Ihren Lieblingsmusiker aus:

Auswahlfeld mit Wertzuweisung: <select name=" "> <option selected value= " "> ... </select>

NAME=Bezeichnung des Feldes (z.B. Vorwahl)
<option selected value=Übertragene Wertzuweisung>Bildschirmanzeige (z.B. Singen)

Wälen Sie Ihr Hobby aus:

Radioknopf: <input type=radio name= value=" "> ...

type=radio (Radioauswahlknopf)
name=Bezeichnung des Feldes (z.B. Nahrungsmittel)
value=Übertragene Wertzuweisung (z.B. Tilsiter)

Was essen Sie am liebsten?

Abhakkästchen: <input type=checkbox name=" " value=" " checked>

type=checkbox (Abhakkästchen)
name=Bezeichnung des Feldes
value=Übertragene Wertzuweisung
checked (Voreinstellung)

Was würden Sie mal gerne machen (voreingestellt ist "Gar nichts", Mehrfachwahl möglich)?

Schopenhauer lesen Mozarts Requiem singen Gar nichts Die Einhard-Basilika-Ruine besuchen In einer Moschee Mozarts Krönungsmesse singen 4 Wochen lang durch Wälder wandern

Eingabefeld: Abschicken <FORM ACTION=Zieladresse method=post><input type=submit value=" ">

form action=Zieladresse (Dateipfad, Internetadresse, mailto:E-Mail-Adresse, hier: inputbsp.txt)
type=submit (Übertragungstaste: Abschicken, OK)
value=Aufschrift (z.B. Übertragen, Abschicken, OK)

Eingabefeld: Löschen <form action=Zieladresse method=post><input type=reset value=" ">

form action=Zieladresse (siehe oben)
type=reset (Löschtaste)
value=Aufschrift (z.B. Zurücksetzen, Löschen)

Großes Formularbeispiel

form action=Zieladresse (Dateipfad, Internetadresse, mailto:E-Mail-Adresse)

Zum Inhaltsverzeichnis Nach oben Weiter