HTML/Elemente/form

Der Begriff form ist mehrdeutig.
Dieser Artikel behandelt das HTML-Element form. Für das gleichnamige HTML-Attribut siehe HTML/Attribute/form.

Das form-Element definiert Formulare auf Web-Seiten.

Syntax

Start-Tag: notwendig

End-Tag: notwendig

WAI‑ARIA‑Rolle

• form

Elternelemente

Darf vorkommen in:

• Elementen mit flow content
• aber nicht: form

erlaubte Inhalte

• beliebig viel flow content
• aber nicht: form

Beispiel

<form action="senden.html" id="person">
    <label class="h2" form="person">Namenseingabe</label>
    <label for="vorname">Vorname</label> 
    <input type="text" name="vorname" id="vorname" maxlength="30">
 
    <label for="zuname">Zuname</label>  
    <input type="text" name="zuname" id="zuname" maxlength="40">

    <button type="reset">Eingaben zurücksetzen</button>
    <button type="submit">Eingaben absenden</button>
</form>

Dieses Formular hat eine ID. Das folgende label-Element verweist mit seinem form-Attribut (person) auf genau dieses Formular. Damit ist eine Beschriftung für das Formular gegeben.
text ist der Standardwert des input-Elements. Für Eingabefelder die Text enthalten sollen, kann das type-Attribut entfallen.

Beachten Sie: Standardverhalten beim Absenden des Formulars (meist durch einen button type="submit") ist, dass die Seite neu geladen wird.
Der default-Wert des type-Attributs für Buttons ist submit, das heißt, auch ein Button ohne type-Attribut sendet das Formular ab.
Das ungewünschte Absenden kann mit button type="button", das Neuladen der Seite mit preventDefault verhindert werden.

Empfehlung: Wenn Sie ein Formular definieren möchten, das die Eingaben an die selbe URL sendet, unter der das Formular erreichbar ist, und GET als Methode benutzt, müssen Sie keinerlei Attribute angeben: <form> reicht aus.

Attribute

Name	Inhalt	Standardwert	Bedeutung
Universalattribute
id	ID		identifiziert ein einziges Element innerhalb eines Dokuments
class	CDATA		ordnet ein Element einer oder mehreren Klassen zu.
accesskey	ID		Tastaturkürzel
contenteditable	CDATA		editierbarer Inhalt
contextmenu			definiert Kontextmenü
dir	ltr, rtl		definiert die Schreibrichtung innerhalb des Dokuments
draggable	ID		kann mit Drag & Drop gezogen werden
dropzone	CDATA		Aktion bei Ablegen
hidden			versteckter Inhalt
lang	NAME		legt eine den IANA-Sprachdefinitionen folgende Sprache des Elementinhalts fest [RFC1766]
spellcheck	ID		Rechtschreibprüfung Sollte auch für input type="password" deaktiviert werden.
style	CDATA		notiert direkt in einem Element- style sheet data
tabindex	NAME		zeigt an, ob dieses Element fokusiert werden kann, ob es mithilfe der Tastaturnavigation angesteuert werden kann und in welcher Reihenfolge navigiert wird.
title	CDATA		betitelt oder beschreibt ein Element.
action	CDATA, aber nicht die leere Zeichenkette		definiert, an welchen URI die Werte der Eingabeelemente gesendet werden. Bei fehlendem Attribut wird die aktuell im Browser geladene Seite verwendet.
accept-charset	CDATA		Liste unterstützter Zeichensätze, siehe RFC2045
autocomplete	on, off		Bestimmt, ob alle enthaltenen Eingabeelemente automatisch vervollständigt werden.
enctype	application/x-www-form-urlencoded, multipart/form-data, text/plain	application/x-www-form-urlencoded	Medientyp, siehe RFC2045
method	get, post, dialog	get	legt die HTTP-Methode fest, nach der die Werte der Eingabeelemente gesendet werden. dialog schließt beim Absenden ein umgebendes dialog-Element.
name	CDATA		Identifizierungsname des Elementes, mit dem die Eingabeelemente in Verbindung gebracht und deren Werte beim Senden übermittelt werden.
novalidate	[Boolesches Attribut]]		Bestimmt, dass die Werte der Eingabeelemente nicht überprüft werden, bevor sie abgesendet werden.
target	_blank, _self, _parent, _top	_self	bestimmt den Fensternamen des Verweisziels.

Attribut: Pflichtattribut
Attribut: optionales Attribut

Siehe auch

• Formulare
  • Was ist ein Webformular?

Weblinks

• Spezifikation (W3C): The form-Element