Formulare

Formulare sind ein zentrales Werkzeug zur Erfassung von Benutzereingaben und deren Übermittlung an einen Server zur Verarbeitung. Sie bestehen aus verschiedenen Formularelementen, die es Nutzern ermöglichen, Daten einzugeben. In diesem Kurs werden jedoch keine Daten an einen Server gesendet, da dies zusätzliche Kenntnisse erfordert, die über den Umfang dieses Kurses hinausgehen.

Alle Codebeispiele enthalten das Attribut onsubmit="return false". Dieses Attribut verhindert standardmäßig, dass das Formular eine Anfrage an den Server sendet.

Formulare erstellen

Das Tag <form> wird verwendet, um ein interaktives Formular zu erstellen.

<form>
  <!-- Form elements go here -->
</form>

Formularelemente

Formulare enthalten Beschriftungen und verschiedene Eingabetypen (Text, Passwort, E-Mail usw.). Beschriftungen verbinden Text mit Eingabefeldern und verbessern die Barrierefreiheit. Weitere Informationen zu Beschriftungen und Eingabetypen folgen in den nächsten Kapiteln.

<form>
  <label for="username">Username:</label>
  <input type="text" id="username" name="username" placeholder="Your username" />
  <label for="password">Password:</label>
  <input type="password" id="password" name="password" placeholder="********" />
</form>

Formularübermittlung

Ein Formular wird mit einem Button mit type="submit" übermittelt.

<form>
  <label for="username">Username:</label>
  <input type="text" id="username" name="username" placeholder="Your username" />
  <label for="password">Password:</label>
  <input type="password" id="password" name="password" placeholder="********" />
  <button type="submit">Submit</button>
</form>

Hier ist das grundlegende Formularbeispiel.