HTML -Eingabeformular* Attribute
Dieses Kapitel beschreibt die verschiedenen form*Attribute für das HTML- <input>Element.
Das Formularattribut
Das Eingabeattribut formgibt das Formular an, zu dem das <input>Element gehört.
Der Wert dieses Attributs muss gleich dem id-Attribut des <form>-Elements sein, zu dem es gehört.
Beispiel
Ein Eingabefeld außerhalb des HTML-Formulars (aber immer noch Teil des Formulars):
<form action="/action_page.php" id="form1">
<label for="fname">First
name:</label>
<input type="text" id="fname" name="fname"><br><br>
<input type="submit" value="Submit">
</form>
<label for="lname">Last
name:</label>
<input type="text" id="lname"
name="lname" form="form1">
Das Formation-Attribut
Das Eingabeattribut formactiongibt die URL der Datei an, die die Eingabe verarbeitet, wenn das Formular gesendet wird.
Hinweis: Dieses Attribut überschreibt das
actionAttribut des <form>Elements.
Das formactionAttribut funktioniert mit den folgenden Eingabetypen: „submit“ und „image“.
Beispiel
Ein HTML-Formular mit zwei Senden-Schaltflächen mit unterschiedlichen Aktionen:
<form action="/action_page.php">
<label for="fname">First
name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname"
name="lname"><br><br>
<input type="submit" value="Submit">
<input type="submit" formaction="/action_page2.php" value="Submit as Admin">
</form>
Das formenctype-Attribut
Das Input formenctype -Attribut gibt an, wie die Formulardaten beim Absenden kodiert werden sollen (nur für Formulare mit method="post").
Hinweis: Dieses Attribut überschreibt das enctype-Attribut des <form>Elements.
Das formenctypeAttribut funktioniert mit den folgenden Eingabetypen: „submit“ und „image“.
Beispiel
Ein Formular mit zwei Senden-Buttons. Der erste sendet die Formulardaten mit Standardkodierung, der zweite sendet die Formulardaten kodiert als "multipart/form-data":
<form action="/action_page_binary.asp" method="post">
<label for="fname">First
name:</label>
<input type="text" id="fname" name="fname"><br><br>
<input type="submit" value="Submit">
<input type="submit"
formenctype="multipart/form-data"
value="Submit as
Multipart/form-data">
</form>
Das formmethod-Attribut
Das Eingabeattribut formmethod definiert die HTTP-Methode zum Senden von Formulardaten an die Aktions-URL.
Hinweis: Dieses Attribut überschreibt das Methodenattribut des <form>Elements.
Das formmethodAttribut funktioniert mit den folgenden Eingabetypen: „submit“ und „image“.
Die Formulardaten können als URL-Variablen (method="get") oder als HTTP-Post-Transaktion (method="post") gesendet werden.
Hinweise zur "get"-Methode:
- Diese Methode hängt die Formulardaten in Name/Wert-Paaren an die URL an
- Diese Methode ist nützlich für Formularübermittlungen, bei denen ein Benutzer das Ergebnis mit einem Lesezeichen versehen möchte
- Die Datenmenge, die Sie in eine URL einfügen können, ist begrenzt (variiert je nach Browser), daher können Sie nicht sicher sein, dass alle Formulardaten korrekt übertragen werden
- Verwenden Sie niemals die „get“-Methode, um vertrauliche Informationen zu übergeben! (Passwort oder andere sensible Informationen werden in der Adressleiste des Browsers angezeigt)
Hinweise zur "post"-Methode:
- Diese Methode sendet die Formulardaten als HTTP-Post-Transaktion
- Formularübermittlungen mit der „Post“-Methode können nicht mit einem Lesezeichen versehen werden
- Die „post“-Methode ist robuster und sicherer als „get“, und „post“ hat keine Größenbeschränkungen
Beispiel
Ein Formular mit zwei Senden-Buttons. Der erste sendet die Formulardaten mit method="get". Der zweite sendet die Formulardaten mit method="post":
<form action="/action_page.php" method="get">
<label for="fname">First
name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname"
name="lname"><br><br>
<input type="submit" value="Submit using
GET">
<input type="submit" formmethod="post" value="Submit using
POST">
</form>
Das formtarget-Attribut
Das Eingabeattribut formtargetgibt einen Namen oder ein Schlüsselwort an, das angibt, wo die Antwort angezeigt werden soll, die nach dem Absenden des Formulars empfangen wird.
Hinweis: Dieses Attribut überschreibt das Zielattribut des <form>Elements.
Das formtargetAttribut funktioniert mit den folgenden Eingabetypen: „submit“ und „image“.
Beispiel
Ein Formular mit zwei Senden-Schaltflächen mit unterschiedlichen Zielfenstern:
<form action="/action_page.php">
<label for="fname">First
name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname"
name="lname"><br><br>
<input type="submit" value="Submit">
<input type="submit" formtarget="_blank" value="Submit to a new window/tab">
</form>
Das formnovalidate-Attribut
Das Eingabeattribut formnovalidategibt an, dass ein <input>-Element beim Senden nicht validiert werden soll.
Hinweis: Dieses Attribut überschreibt das novalidate-Attribut des <form>
Elements.
Das formnovalidateAttribut funktioniert mit den folgenden Eingabetypen: Submit.
Beispiel
Ein Formular mit zwei Submit-Buttons (mit und ohne Validierung):
<form action="/action_page.php">
<label for="email">Enter your
email:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="Submit">
<input type="submit"
formnovalidate="formnovalidate"
value="Submit without validation">
</form>
Das novalidate-Attribut
Das novalidateAttribut ist ein <form>Attribut.
Wenn vorhanden, gibt novalidate an, dass nicht alle Formulardaten validiert werden sollen, wenn sie gesendet werden.
Beispiel
Geben Sie an, dass beim Absenden keine Formulardaten validiert werden sollen:
<form action="/action_page.php" novalidate>
<label
for="email">Enter your email:</label>
<input type="email"
id="email" name="email"><br><br>
<input type="submit"
value="Submit">
</form>
HTML-Formular und Eingabeelemente
| Tag | Description |
|---|---|
| <form> | Defines an HTML form for user input |
| <input> | Defines an input control |
Eine vollständige Liste aller verfügbaren HTML-Tags finden Sie in unserer HTML-Tag-Referenz .