Javascript und Formulare
Wie war das noch mal....?
Auf dieser Seite finden Sie eine gute Übersicht über den Zugriff auf die einzelnen Form-Elemente!
1. Anzeigen einer Auswahl
- Erstellen Sie eine Selectbox mit mindestens drei verschiedenen Teigsorten (z.b Weizen, Vollkorn und Vegan) als Optionen irgendwo im Html-Dokument. Achten Sie dabei auf die Angabe eines Values für jede Möglichkeit.
- Schreiben Sie eine Funktion, die bei der Auswahl einer Teigsorte aufgerufen wird (onchange). Innerhalb der Funktion wird ein Alert gestartet, der den aktuell ausgewählten Teig anzeigt.
2. Anzeigen einer Liste
- Erstellen Sie an einer Stelle des Dokumentes ein p-Element mit einer ID.
- Schreiben Sie nun eine weitere Funktion, die aufgerufen wird, wenn der Benutzer mit der Maus über die Teigauswahlliste hovert. Durch die Funktion soll eine Liste der Teigsorten in das gerade erstellte p-Element geschrieben werden.
3. Anzeigen von Bestelldetails
- Erstellen Sie zwei zusammengehörige Radio-Buttons, mit den Labels "Lieferung" und "Abholung".
- Erstellen Sie zusätzlich ein Inputfeld (mit Label) für eine Liefergebühr. Schreiben Sie einen beliebigen Wert in das Input-Feld.
- Schreiben Sie nun eine Funktion, die durch einen Button aufgerufen wird. Innerhalb der Funktion soll überprüft werden, ob eine Liefergebühr gezahlt werden muss oder nicht.
- Erstellen Sie dazu eine Variable, die den ausgewählten Wert der radio-Buttons enthält (siehe hierzu den Hinweis weiter unten).
- Nehmen Sie sich die Berechnung des Ergebnisses aus der Funktion "rechnen()".
- Schreiben Sie eine bedingte Anweisung (if/else), die überprüft, ob der Wert von der eben erstellten Variable gleich dem Wert "Lieferung" ist. Nutzen Sie dabei Vergleichsoperatoren. Im positiven Fall wird in das, anfangs erstellte, p-Element ein Text geschrieben, der auf die Liefergebühr hinweist. Dazu lesen Sie bitte den Wert aus dem entsprechenden Inputfeld aus und zeigen ihn mit dem Text an. Im negativen Fall soll ein Text erscheinen, der den Benutzer unterrichtet, wieviel Euro er nun zahlen muss. Nutzen Sie dazu die bereits erstellte Berechnung, die Sie aus der anderen Funktion übernommen haben.