LU07.A01 - Fahrzeug-Konfigurator
Ihre Aufgabe ist es, ein HTML-Formular für einen Fahrzeug-Konfigurator zu erstellen. In diesem Formular sollen die Kunden verschiedene Optionen für ihr neues Fahrzeug auswählen können. Die Formularelemente select und radiobutton sollen hierbei verwendet werden, um den Unterschied und den spezifischen Einsatz dieser beiden Elemente zu verdeutlichen.
Vorgehen
- Akzeptieren Sie das GitHub Classroom Assignment für die LU07.A01
- Klonen Sie das Repository.
- Erstellen Sie die HTML-Webseite in der Datei
/carconfig.html. Halten Sie sich dabei an die Anforderungen. - Validieren Sie Ihren HTML-Code auf Einhaltung der Standards.
- Geben Sie Ihre Lösung mittels Push ins Repository ab.
- Beantworten Sie die Fragen hier in der Moodle-Aufgabe.
Anforderungen an das Formular
Erstellen Sie ein select Element, das die Wahl zwischen verschiedenen Fahrzeugmodellen ermöglicht (wie z.B. Modell A, Modell B, Modell C, und so weiter). Fügen Sie mindestens 15 Fahrzeugmodelle ein. Benennen Sie das select Element „Fahrzeugmodell“.
Erstellen Sie radiobutton Elemente für verschiedene Lackfarben, die für das ausgewählte Fahrzeugmodell verfügbar sind (wie z.B. Rot, Blau, Grün, Schwarz). Der Wert der radiobutton Elemente soll die jeweilige Lackfarbe (z.B. „Rot“, „Blau“, „Grün“, „Schwarz“) sein, fassen Sie alle Farben unter dem Namen „Lackfarbe“ zusammen.
Zusätzliche Anforderungen:
- Verwenden Sie geeignete Formularelemente (z.B. ein
fieldsetundlegendElement), um die verschiedenen Elementtypen visuell zu trennen und zu organisieren oder fügen Sielabel-Elemente hinzu, um die verschiedenen Elementtypen und Optionen klar zu kennzeichnen. - Fügen Sie schließlich einen
submitButton hinzu, um die Formularinformationen an https://it.bzz.ch/demo/formdata/index.php zu senden.
⇒ GitHub Repo für externe Besucher
GitHub Repository https://github.com/BZZ-M293/m293-lu07-a01-car
Lernende am BZZ müssen den Link zum GitHub Classroom Assignment verwenden
Kevin Maurizi, Marcel Suter