Werbung einblenden Werbung ausblenden


Home / Tutorials / Perl Handbuch / Übergabe der Usereingaben

Der Aufbau eines HTML Formulars mit allen Formularelementen
Das Formularelement Check Box
Das Formularelement Radio Button
Ein versteckt übergebenes Formularelement
Ein Formularelement, das "JavaScript event handler" bindet

Ein Formularelement, das es ermöglicht x-beliebige Dateien auf einen Fremdrechner "upzuloaden"
Der Aufbau des Query Strings

Der Aufbau eines HTML Formulars mit allen Formularelementen

Die meisten Perl Skripte werden von HTML Formularen angeschoben. Gästebücher, Autobörsen, Immobilienbörsen, Chats, Foren, Auktionen, etc. erhalten ihren Input über HTML Formulare. Das hat erst mal wenig mit Perl zu tun, sondern ist ein Bestandteil von HTML.
Eine kurze Wiederholung erfolgt anhand eines Beispiels:

<html><head>
<title>Alle Formularelemente auf einen Blick</title></head>
<body>
<form action name=mein_perl_script.pl method=get>
<input type=hidden name=modul value=eins>
Name <input type=texte value="Geben Sie hier Ihren Namen ein"><br>
<hr>
Wie haben sind Sie auf diese Website gestossen <br>
Tip von Freunden <input type=checkbox name=wie value=Freund> <br>
&uuml;ber eine Suchmaschine <input type=checkbox name=wie value=Suchmaschine> <br>
durch Zufall <input type=checkbox name=wie value=Zufall> <br>
<hr>
Sie sind m&auml;nlich <input type=checkbox name=geschlecht value=m>
weiblich <input type=checkbox name=geschlecht value=weiblich> <br>
<hr>
Wie gef&auml;llt Ihnen diese Website
<select name=gusto><option value=hervorragend>Ich bin begeistert
<option value="ganz toll">Ich krieg mich kaum noch ein
<option value=genial>Das Beste dieser Art &uuml;berhaupt
</select>
<hr>
Ich m&ouml;chte &uuml;ber &Auml;nderungen dieser Website informiert werden
<input type=checkbox name=informieren> <br>
<hr>
Kommentar<br>
<textarea rows=5 cols=40 name=beitrag>
Sie haben hier die M&ouml;glichkeit, uns Verbessserungsvorschl&auml;ge zu machen</textarea>
<hr>
M&ouml;chten Sie uns auch ein Bild schicken ?<br>
<input type=file name=bild>
<hr>
<input type=button value="passiert nix">
<input type=reset value="Formulardaten l&ouml;schen"><input type=submit value=abschicken>
</form>
</body>
</html>

Das Formular zeigt alle Formularelemente. Drückt man auf den Knopf abschicken, baut der Browser den Query_String zusammen. Ein genaues Verständnis, wie dieser Query_String aufgebaut ist, ist für die Internetprogrammierung unverzichtbar, völlig unabhängig von der gewählten Technologie: Active Server Pages, CGI Programmierung, Java Servlets, Cold Fusion etc.

Das Formularelement Check Box

Das Element Checkbox taucht in diesem Formular zweimal auf. Einmal in der Variante, dass es nur eine Checkbox mit demselben Namen gibt:

<input type=checkbox name=informieren2>

Wird diese Box angeklickt, dann entsteht:  
informieren=on
bzw. informieren=

wenn diese Box nicht angeklickt wird. Zweitens taucht noch die Variante auf, dass es eine Checkbox mit demselben Namen mehrere Male gibt:

<input type=checkbox name=wie2 value=Freund>
<input type=checkbox name=wie2 value=Suchmaschine>
<input type=checkbox name=wie2 value=Zufall>

Werden mehrere Checkboxen mit dem gleichen Namen angeklickt, entsteht ein Query_String der so aussieht: wie=Freund&wie=Suchmaschine&wie=Zufall Bei dieser zweiten Variante haben wir insofern ein Problem, als die Art und Weise, wie der Query_String von dem verarbeitenden Programm ausgelesen wird, muss modifiziert werden muss, da es jetzt eine Variable gibt, die mehrere Werte hat. Wir müssen also dafür sorgen, dass der jeweilige Wert der Variablen wie nicht den vorhergehenden Wert überschreibt. Das kann man bei Verwendung des CGI.pm Moduls, siehe Das Cgi.pm Modul, dadurch erreichen, dass man die Werte an ein Array übergibt, oder, wenn man die Routine selber schreibt, die einzelnen Werte in einem Array sichert.

Das Formularelement radio button

<input type=checkbox name=geschlecht2 value=m>
<input type=checkbox name=geschlecht2 value=weiblich>

Der Radio Button hat von der Natur der Sache her einen identischen Namen, denn es kann von einer "Radio Button Familie" nur ein Element angeklickt werden. Bei Radio Buttons müssen also alle Elemente den gleichen Namen haben, da der Browser sonst keine Chance hat, sie als zusammengehörend zu erkennen. Im übrigen ist man nicht gezwungen, einen Wert (value) anzugeben, allerdings ist der Radio Button dann sinnlos, weil dann, egal welcher Wert angeklickt wurde, immer das gleiche übergeben wird.

ein versteckt übergebenes Formularelement

Da die anderen Formularelemente selbsterklärend sind, bleiben nur noch drei übrig, zu denen es etwas zu sagen gibt. Da ist hidden:

<input type=hidden name=modul2 value=eins>

Dieses Formularelement wird versteckt übergeben, das heißt, der User soll es nicht beeinflussen. (Betonung liegt auf soll. Er kann natürlich die HTML Seite abspeichern und dann den Wert modifizieren.)
Mit diesem Modul können Variablen übergeben werden, die den User identifizieren. Dies ist z.B. bei Shops wichtig. Es können aber auch Variablen übergeben werden, die das Programm steuern, z.B. wenn ein Skript mehrere Funktionen hat und entschieden werden muss, welche abgearbeitet werden sollen.

ein Formularelement, das "JavaScript event handler" bindet

Sehr schnell erklärt ist das folgende Formularelement:

<input name="button" type=button value="passiert nichts">

Dieses Formularelement hat nur eine einzige Funktionalität, die darin besteht, dass die JavaScript event handler an dieses Element gebunden werden können.

ein Formularelement, das es ermöglicht x-beliebige Dateien auf einen Fremdrechner "upzuloaden"

Komplexer ist dann schon dieses Element:

<input type=file name=bild2>

Dieses Formularelement wurde erst sehr viel später eingeführt. Mit diesem Element wird es möglich, jede x-beliebige Datei auf den Fremdrechner "upzuloaden". Dies ermöglicht z.B. bei Anzeigenmärkten die Darstellung der Waren mit Bild. Wie es eingesetzt wird und Details siehe Bildupload aus dem Browser.

der Aufbau des Query_Strings

Machen wir uns kurz die Struktur des Query_Strings klar, wenn dieses Formular angeschoben wird. Klar ist, dass wir nur die Struktur beschreiben, da sich das konkrete Aussehen ja von Fall zu Fall ändert.
Der Query_String könnte beispielsweise so aussehen:

?modul=eins&wie=Freund&wie=Suchmaschine&ge&geschlecht
=m&gusto=ganz+toll&beitrag=Wahnsinn%2C+hier+geht+ja+voll+die%0D%0APost+ab


Wer das nicht glaubt, der kann den Query_String vom Browser produzieren lassen. Man schnappt sich das Formular, speichert es unter ein_geiler_Name.htm und ruft es im Browser auf. Dann wird ein Inhalt eingetragen und auf abschicken gedrückt. In der Adressleiste des Browsers erscheint der Query_String in seiner ganzen Pracht. Der Query_String beginnt nach dem Fragezeichen. Vor dem Fragezeichen steht normalerweise die Url, also z.B. http://www.eine_domain.de.

Wir erkennen ein Muster, das so aussieht:
Name_des_ersten_Formularelementes=Wert_des_ersten_Formularelementes&Name
_des_zweiten_Formularelementes=Wert_des_zweiten_Formularelementes etc.

Wir erhalten also Name/Werte Paare, die durch das kaufmännische & Zeichen getrennt sind.
Wie dieser Query_String mit Perl ausgelesen wird, siehe Perl Routine zum Auslesen des QUERY_STRING.

Hier nur kurz die Besonderheiten, die zu beachten sind. Wir haben zweimal den Namen wie, nämlich wie=Freund und wie=Suchmaschine. Will man beide Werte retten, muss man sich was einfallen lassen. Details liefert das Kapitel das Cgi.pm Modul.
Weiter fällt auf, dass überall dort, wo bei den Eingaben in die Formularfelder ein Leerzeichen steht, der Browser dieses Leerzeichen durch ein + Zeichen ersetzt. Dieses + Zeichen muss dann hinterher, bei der Auswertung mit Perl, wieder eliminiert werden.
Sonderzeichen, wie ä,ö,ü,ß,!,§ etc. werden durch Hexadezimalzeichen ersetzt. Auch das muss wieder rückgängig gemacht werden.

Der Aufbau des Query_Strings sollte verinnerlicht werden, da es in der Internetprogrammierung häufig vorkommt, dass er "mit der Hand" geschrieben werden muss, weil z.B. schon beim Aufruf eines Perl Programms bestimmte Variablen, die das Skript steuern, mit übergeben werden müssen.

vorhergehendes Kapitel