Formular-Attribute
Einfaches Formular
1<form action="/server.php" method="post" autocomplete="on">
2 <label for="name">Name:</label>
3 <input type="text" id="name" name="name" autocomplete="name" required>
4
5 <label for="email">E-Mail:</label>
6 <input type="email" id="email" name="email" autocomplete="email" required>
7
8 <button type="submit">Absenden</button>
9</form>1. Das action-Attribut
Das action-Attribut legt fest, wohin die Formulardaten nach dem Absenden geschickt werden.
Beispiel: action="/server.php"
Die Daten werden an server.php gesendet und dort verarbeitet, gespeichert oder weitergeleitet.
Wenn kein action-Attribut angegeben wird, wird das Formular an die aktuelle Seite gesendet.
2. Das method-Attribut
Das method-Attribut bestimmt, wie die Formulardaten übertragen werden.
Formulare versenden mit Get
method="get": Daten werden sichtbar an die URL angehängt. Das sieht in etwa so aus, wenn du ein Formular mit Name und E-Mail mit method="get" absendest: https://example.com/register?name=Max+Mustermann&email=max%40example.com
method="get" eignet sich gut für Suchformulare oder Filter, weil du die URL teilen kannst.
Sensible Daten wie Passwörter solltest du nicht mit method="get" senden.
Formulare versenden mit Post
method="post": Daten werden im Body der Anfrage übertragen
method="post" zeigt die Daten nicht direkt in der URL an.
Wichtig: post ist nicht automatisch sicher. Für sensible Daten solltest du immer HTTPS verwenden.
Wenn kein method-Attribut angegeben wird, verwendet der Browser standardmäßig get.
3. Das autocomplete-Attribut
Das autocomplete-Attribut steuert, ob der Browser Eingaben vorschlägt oder automatisch ausfüllt.
- autocomplete="on": Vorschläge und gespeicherte Daten sind erlaubt
- autocomplete="off": Der Browser soll keine Vorschläge machen
Das autocomplete-Attribut kannst du sowohl im <form>-Element als auch direkt an einzelnen <input>-Feldern setzen, um dem Browser genau zu sagen, welche Art von Daten dort erwartet werden.
Bei einzelnen Eingabefeldern kannst du genauer angeben, welche Daten erwartet werden.
Autocomplete für eine Namenseingabe
1<input type="text" autocomplete="name">Autocomplete für e-mail
1<input type="email" autocomplete="email">Autocomplete für eine Passworteingabe
1<input type="password" autocomplete="current-password">Im nächsten Kapitel lernst du: Formular Elemente