======Webformulare====== Mit Hilfe von Webformularen kann man Daten zwischen Webseiten und Webskripten Austauschen. Ein Formular wird in den ''%%
...
%%'' eingebettet. Im Attribut ''%%action%%'' wird die Datei/Webseite angegeben, die vom Formular aufgerufen wird. Innerhalb des Formular-Tags werden nun verschiedene Formularelemente (Siehe unten!) eingebettet, in die die zu übertragenden Daten eingegeben werden. Das folgende Beispiel zeigt ein einfaches Webformular, welches den Inhalt des Eingabefeldes an die Google-Suche sendet. **Aufgabe 1** Teste das Beispiel! Formulare
Im folgenden wird die Funktionsweise von Formularen kurz beschrieben. Eine ausführlichere Darstellung findet man hier: https://wiki.selfhtml.org/wiki/HTML/Tutorials/Formulare . =====Datenübertragung===== Die zu übertragenden Daten werden in Eingabeelemente (''%%input%%'') eingetragen bzw. sind vordefiniert. Damit die Daten von der aufgerufenen Webseite erkannt werden, benötigt jedes Eingabeelement einen Namen (''%%name%%'') und einen Wert/Inhalt (''%%value%%''). Die Angabe ''%%value%%'' ist nur notwendig, wenn nichts eingegeben werden kann. Bei der Datenübertragung unterscheidet man zwei unterschiedliche Methoden (''%%method%%''): POST und GET. Bei GET erscheinen die zu übertragenden Daten in der URL, bei POST werden sie verschlüsselt geschickt. Voreingestellt ist die Methode GET. Die Datenübertragung kann durch verschiedene Aktionen ausgelöst werden z.B. durch das Klicken auf einen Button oder das Betätigen der -Taste in einem Eingabefeld =====Eingabeelemente===== Eingabeelemente in Formularen werden mit dem ''%%%%''-Tag realisiert. Eine vollständige Auflistung aller Elemente findet man hier: https://wiki.selfhtml.org/wiki/HTML/Tutorials/Formulare/input . Im folgenden Beispiel werden einige ''%%%%''-Elemente demonstriert. Formulare
Name:
Password:
Datum:
Farbe:
**Aufgabe 2** Teste das Beispiel! =====Auswahllisten===== Bei Auswahlelementen kann der Nutzer zwischen verschiedenen Optionen wählen. Eine vollständige Beschreibung von Auswahllisten findet man hier: https://wiki.selfhtml.org/wiki/HTML/Tutorials/Formulare/Auswahllisten. Das folgende Beispiel demonstriert eine Auswahlliste: Formulare
**Aufgabe 3** Teste das Beispiel! =====Buttons===== Mit Buttons in Formularen können je nach Option verschiedene Aktionen ausgelöst werden: * ''%%type = "submit"%%'' - Formular wird an die Seite die in ''%%action%%'' angegeben ist übermittelt (Voreinstellung) * ''%%type = "button"%%'' - eine Aktion (clientseitig, z.B JavaScript) auf der aktuellen Webseite wird ausgelöst * ''%%type = "reset"%%'' - Formular wird zurückgesetzt Das folgende Beispiel demonstriert die Verwendung der Optionen. Formulare




**Aufgabe 4** Teste das Beispiel! Eine ausführliche Beschreibung zu Buttons findet man hier: https://wiki.selfhtml.org/wiki/HTML/Tutorials/Formulare/Was_ist_ein_Webformular%3F#Buttons **Aufgabe 5** Das Formular im folgenden Beispiel enthält einige der bisher besprochenen Formularelemente. Teste das Beispiel! (Hinweis: Das ''%%action%%''-Attribut ist leer. Man kann aber nach dem Absenden die Attribute in der URL ablesen, da ''%%method='get'%%'' verwendet wird. Formulare