e1:formulare

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.

  • einfache 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:zerr(a)modellschule-obersberg.de" method="post">
            <p><b>Ihre E-Mail-Adresse:</b><br>
                <input type="text" 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>

Formulare

Zugauskunft

Ihre E-Mail-Adresse:

Finde eine Verbindung:

von (Bahnhof):
nach (Bahnhof):
Datum (tt.mm.jj):
Uhrzeit (hh:mm):

Nur Verbindungen mit:
Schlafwagen
Liegewagen
Fahrradbeförderung

Zuggattung:

Bahncard:
Ja Nein

Formulare verschicken und auswerten

Die im Formular eingegebenen Daten müssen an den Empfänger verschickt werden. Im einfachsten Fall geschieht das als E-Mail. Dazu gibt man im <form>-Element im Attribut action die E-Mail-Adresse des Empfängers an und setzt das Attribut method auf post. Über den Abschicken-Schalter wird dann automatisch eine E-Mail mit den eingegebenen Daten erzeugt und verschickt. Für eine automatische Reaktion auf ankommende Formulardaten muss der Internet-Provider eine passende Skript-Schnittstelle (CGI, PHP, ASP,…) zur Verfügung stellen. Das ausgefüllte Formular wird über das Skript ausgewertet und ein Antwort-Dokument generiert, das an den Absender des Formulars zurückgeschickt wird. Diese Technik wird beispielsweise bei den Suchmaschinen benutzt.

siehe auch PHP

  • /var/www/infowiki/data/pages/e1/formulare.txt
  • Zuletzt geändert: 2018/08/27 07:08
  • von admin03