Dies ist eine alte Version des Dokuments!
Zum Aufbau von Formularen benutzt man das HTMLElement <form>. Mit <input … > können verschiedenartige Eingabefelder erzeugt werden. Die Eingabeart wird durch das Attribut type festgelegt, die Größe des Eingabefeldes durch size.
- Leinfache rechteckige Eingabefelder (type=“text“)
- qudratische Mehrfach-Auswahlfelder (type= “checkbox“)
- kreisförmige Alternativ-Auswahlfelder (type=“radio“)
- Schalterfelder: Abschicken und Verwerfen (type=“submit“ und type=“reset“)
Bei Mehrfach- und Alternativ-Auswahlfeldern werden die einzelnen Werte mit dem value-Attribut angegeben. Jedes Eingabefeld erhält über das Attribut name einen Namen, um beim Abschicken des ausgefüllten Formulars die Eingaben den jeweiligen Formularfeldern zuordnen zu können. <select> benutzt man zum Aufbau von Auswahl- Menüs, wie im Beispiel bei der Zuggattung. Jede einzelne Auswahlmöglichkeit wird über eine <option>- Kennung definiert. <textarea> verwendet man für mehrzeilige Eingabefelder.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <title>Formulare</title> </head> <body> <h1>Zugauskunft</h1> <form action="mailto:groehner@t-online.de" method="post"> <p><b>Ihre E-Mail-Adresse:</b><br> <input name="EMail" size="34"> </p> <p><b>Finde eine Verbindung:</b></p> <table> <tr><td>von (Bahnhof):</td> <td><input type="text" name="Von" size="20"></td></tr> <tr><td>nach (Bahnhof):</td> <td><input type="text" name="Nach" size="20"></td></tr> <tr><td>Datum (tt.mm.jj):</td> <td><input type="text" name="Datum" size=" 8"></td></tr> <tr><td>Uhrzeit (hh:mm):</td> <td><input type="text" name="Zeit" size=" 5"></td></tr> </table> <p><b>Nur Verbindungen mit:</b><br> <input type="checkbox" name="Verbindung" value="schlaf">Schlafwagen <br> <input type="checkbox" name="Verbindung" value="liege">Liegewagen <br> <input type="checkbox" name="Verbindung" value="fahrrad">Fahrradbeförderung </p> <p><b>Zuggattung:</b><br> <select name="Zuggattung"> <option> InterCity-Express (ICE) </option> <option> EuroCity (EC) </option> <option> InterCity (IC) </option> <option> InterRegio (IR) </option> <option> RegionalBahn (RB) </option> <option> StadtExpress (SE) </option> </select> </p> <p><b>Bahncard:</b><br> <input type="radio" name="Bahncard" value="Ja">Ja <input type="radio" name="Bahncard" value="Nein">Nein </p> <p> <input type="submit" value="Abschicken"> <input type="reset" value="Verwerfen"> </p> </form> </body> </html>