Grundlagen der Formularerstellung

Das HTML-Element <form> ist ein grundlegender Baustein zur Erstellung interaktiver Formulare auf einer Webseite. Es dient als Container für alle Formularelemente. Lassen Sie uns ein Beispiel für ein einfaches Formular erkunden:

Hinweis

Alle Beispiele enthalten das Attribut onsubmit="return false", um das Standardverhalten der Formularübermittlung zu verhindern. Auf diese Weise bleibt der Fokus auf dem Verständnis der Formularerstellung und -attribute.

Erläuterung der form-Attribute:

• name bietet eine eindeutige Kennung für das Formular auf einer Webseite. Sowohl der Server als auch der Client verwenden diese Kennung, um die Formulardaten zu verarbeiten. Der Formularname kann Zahlen, Unterstriche, Bindestriche und englische Alphabetzeichen enthalten, darf jedoch keine Leerzeichen enthalten;
• autocomplete bestimmt, ob Webbrowser Formularfelder automatisch ausfüllen können. Es kann auf "on" oder "off" gesetzt werden und auf einzelne Formularelemente angewendet werden;
• novalidate gibt an, dass Browser keine Formularfeldvalidierung durchführen sollen. Dies kann nützlich sein, wenn Sie die Validierung manuell mit JavaScript durchführen möchten;
• method gibt die HTTP-Methode an, die verwendet wird, um die Formulardaten an den Server zu senden. Die beiden häufigsten Methoden sind GET und POST. Dieses Thema wird im JavaScript-Kurs ausführlich behandelt.

Überblick über Kindelemente innerhalb eines Formulars

Innerhalb des form-Elements finden Sie verschiedene Kindelemente, die für die Formularfunktionalität unerlässlich sind. Das input-Element ermöglicht es Benutzern, verschiedene Datentypen einzugeben, wie Text, Zahlen und Daten. In diesem Beispiel wird type="email" für das E-Mail-Feld und type="password" für das Passwortfeld verwendet. Das label-Element organisiert und strukturiert das Formular, indem es beschreibenden Text für Eingabefelder bereitstellt und den Benutzern hilft, deren Zweck zu verstehen. Das Button-Element mit type="submit" wird verwendet, um die Formulardaten beim Klicken an den Server zu senden. Standardmäßig lädt das Absenden des Formulars die Webseite neu, aber dieses Verhalten kann mit JavaScript angepasst werden.