Erweiterte Formulare

Auswahllisten

Mit Listen können wir große Mengen an Auswahloptionen kompakt darstellen. Ein Beispiel wäre das Bundesland aus dem unser Benutzer kommt.

Oops, an error occurred! Code: 20190420191540af85f90c

Aus Platzgründen hab ich mir den Rest der Bundesländer gesparrt, aber ich  denke das Prinzip wird klar.


Das ganze bauen wir natürlich auch in unser Formular ein:

Oops, an error occurred! Code: 2019042019154053d935d0

Nun ist unser Formular fast schon komplett, aber ein entscheindendes Element fehlt noch. Dieses Element ist der Button zum Abschicken.

Submit Buttons

Einen Submit Button bauen wir mit folgendem Tag ein:

Oops, an error occurred! Code: 201904201915403a6088ae

Wir müssen also als Attribut type "submit" angeben. Um die Beschriftung des Buttons zu ändern, müssen wir den Wert des Value Attributs bearbeiten.Ein Element habe ich in unserem Mailformular nicht verwendet, das ist das Passwortfeld.

Passwortfelder

Mit einem Passwortfeld kann man ein Feld einbauen in dem alle eingaben in Form von Sternchen dargestellt werden. Dadurch können zuschauer das eingegebene Passwort nicht lesen.

Tag für ein Passwortfeld:

Oops, an error occurred! Code: 201904201915409f634066

Ausserdem kann man noch versteckte Felder in ein Formular einbauen.

versteckte Formularfelder

Ein verstecktes Formularfeld dient zu reinen Datentransport. Bei PHP Skripten kann man z.B. soetwas manchmal finden:

Oops, an error occurred! Code: 20190420191540979ed391

Damit kann der Programmierer später abfragen ob das Formular abgesendet wurde. Versteckte Felder können also nützlich sein um z.b. statusvariablen etc zu übermitteln. Man sollte sie jedoch niemals dazu nutzen Sicherheitsrelevante Informationen vom Server zum Client zu übertragen um diese nach dem abschicken des Formulars wieder zu nutzen. Denn der Quelltext ist beim Client lesbar und veränderbar.


In unserem Mailformular habe ich auf ein verstecktes Feld verzichtet.

Unser Formular ist jetzt soweit fertig und der Quelltext sieht wie folgt aus:

Oops, an error occurred! Code: 2019042019154099bf06f3

Die aus diesem Feld generierte Mail würde so aussehen:

name=Timo Schmidt
meinung=Tolle Internetseite
kenntnisse=bilder
kenntnisse=frames
kenntnisse=tabellen
kenntnisse=formulare
geschlecht=maennlich
bundesland="Hamburg"

 

Navigation