Besprechung der Hausaufgaben

02.12.2016 11:31 Uhr

Besprechung der Hausaufgaben

Gruppe 1 – Mittwoch 08:00 Uhr

Lösung A: wrobel_laura

Lösung B: schiffer_tom

Hinweis: Die Aufgaben werden nach der Sitzung wieder entfernt!

Gruppe 2 – Mittwoch 10:00 Uhr

Lösung A: kühn_michelle

Lösung B: zorn_tobias

Hinweis: Die Aufgaben werden nach der Sitzung wieder entfernt!

Validierung von Formularen und Ausfüllhilfen

Seit HTML5 ist es möglich, Formulare zu validieren. Dies bedeutet, dass an den Browser mittels Attributen mitgeteilt wird, welche Werte erlaubt sind. Das Formular wird erst dann abgeschickt, wenn alle Eingabeelemente entsprechend der definierten Vorgaben korrekt ausgefüllt sind.

Das einfachste Attribut ist required. In HTML ist es wertfrei (nicht sinnfrei 😉 ). Wertfrei meint, dass es nur gesetzt wird ohne dass ihm mit dem Operator ‚=‘ ein Wert zugewiesen wird.

Hinweis: Die Browser reagieren hier unterschiedlich. Firefox setzt es zur Zeit richtig um, Chrome nicht.

Beispiel:

<input type="text" required>

Das Formular darf erst dann abgesendet werden, wenn dieses Pflichtfeld ausgefüllt ist.

Weitere Validierungsregeln werden aus dem Wert des gesetzten Attributs type abgeleitet.

Beispiele:
type=“email“ erlaubt nur E-Mail-Adressen.
type=“date“ blendet einen kleinen Kalender ein.

Eine Auflistung der HTML input types finden Sie bei w3schools.

„Klassische“ Werte von type sowie „klassische“ Attribute werden in HTML ebenfalls unterstützt: selfhtml.

Darstellung von Validierungsfehlern:

Mittels neuer Pseudo-Klassen lassen sich invalide Elemente mit CSS hervorheben:

input:invalid {
	  background-color: #ffdddd;
	}

	input:valid {
	  background-color: #ddffdd;
	}
	   
	input:required {
	  border-color: #800000;
	  border-width: 3px;
	}

vgl. Mozilla Developer Network

Anmerkungen:

nächste Folie

Schlagwörter: