HTML: Formulare definieren

Formulare kann man sich wie ein gewöhnliches Formular aus Papier vorstellen: Man schreibt etwas rein, kreuzt etwas an und schickt es dann (mit der Post) ab. Ebenso funktionieren auch Formulare in HTML-Dokumenten.

Grundsätzliches

Grundsätzlich gibt es einige Dinge die bei (fast) allen Formularelementen gleich sind. Dazu gehört z.B. das name-Attribut, das accesskey-Attribut oder das tabindex-Attribut.

Das name-Attribut dient als Bezeichner für das jeweilige Element. Es kann bei den folgenden Formularelementen angewandt werden: form, input, select, textarea und button. Beispiel:

<form name="FormularName">
<input name="InputName">
... usw. ... 

Das accesskey-Attribut beschreibt eine Taste, auf deren Knopfdruck zu dem jeweiligen Element gescrollt/gesprungen/zugegriffen (access key = engl. Zugriffstaste) werden soll. Es kann bei den folgenden Formularelementen angewandt werden: label, input, textarea, legend und button. Beispiel:

<label accesskey="a">
<input accesskey="b">
... usw. ... 

Das tabindex-Attribut beschreibt die Reihenfolge wie die jeweiligen Elemente beim Drücken der Tabulator-Taste angesprungen werden sollen. Es kann bei den folgenden Formularelementen angewandt werden: input, select, textarea und button. Beispiel:

<input tabindex="2">
<input tabindex="1">
<button tabindex="3">
... usw. ... 

Formular definieren

Das form-Element ist der Grundstein zu einem Formular. In ihm wird all das notiert was in dem Formular enthalten sein soll. Beispiel:

<form name="Formular" method="post" action="/cgi-bin/mail.pl">
... Formularinhalt ...
</form> 

Das action-Attribut nimmt bei Formularen die Stelle eines Verweises ein. Als Wert wird hier auf das Programm verwiesen, welches das Formular bearbeiten soll. Dies können CGI Scripte/Anwendungen, E-Mail oder andere Dinge sein. Beispiel:

<form name="Formular" method="get" action="/cgi-bin/mail.pl">
 ... Formularinhalt wird beim Abschicken von der CGI 
     Anwendung mail.pl verarbeitet...
</form>

	
<form name="Formular" method="post" action="mailto:help@html-world.de">
 ... Formularinhalt wird per E-Mail an help@html-world.de 
     abgeschickt...
</form> 

Das method-Attribut beschreibt, wie (nach welcher Methode) das Formular verarbeitet wird. Als Wert sind post oder get möglich.

Post bedeutet, dass der Formularinhalt wie eine Benutzereingabe in der Komandozeile verarbeitet wird. Post können Sie z.B. verwenden, wenn Sie den Inhalt eines Formulars als E-Mail versenden wollen.

Get bedeutet, dass der Formularinhalt bei HTTP-Servern durch eine CGI-Anwendung/ein CGI-Programm ausgelesen werden und verarbeitet werden muss.

Enctype-Attribut

Das enctype-Attribut bestimmt die Art der Daten des Formulars. Als Wert können hier die Media-Typen eingetragen werden. Zum versenden von E-Mails eignet sich der Wert/Typ text/plain. Dabei wird ausgesagt, das es sich um reinen (plain = engl. rein, deutlich) Text handelt. Beispiel:

<form action="mailto:name@domäne.de" method="post" 
      enctype="text/plain">
 ... Formularinhalt ...
</form> 

Du arbeitest in einer Agentur oder als Freelancer?
Dann wirf doch mal einen Blick auf unsere Software FeatValue.

Weiterlesen: ⯈ Formulare – Felder

Über uns

Wir entwickeln Webanwendungen mit viel Leidenschaft. Unser Wissen geben wir dabei gerne weiter. Mehr über a coding project