Home
Home

 

Top im Web BASIC

» BASIC Home
» Fragen/Antworten

 

Top im Web BASIC - eine Webpublishing-Einführung
Kurs der Universität Bern


Teil 11

Formulare bringen Interaktivität 

Nett wäre, wenn ab und zu ein Echo auf die eigene Website käme... kein Problem. Es ist ein Kinderspiel, Formulare in die eigene Website einzubinden und sich den Inhalt zustellen zu lassen. Allerdings spielt hier wiederum der Netscape Composer nicht mit - Ihr müsst im Quelltext arbeiten oder ein professionelles Tool kaufen.

Formularinhalte können a) über E-Mails und b) über einen CGI-Server oder mittels PHP übertragen werden. CGI oder PHP sind komfortabler; wir kümmern uns hier nur um CGI. Die Daten werden dank CGI (Common Gateway Interface) zuerst sauber dargestellt und einem per Mail zugestellt anstatt dass sie direkt per Mail (analog zum mailto-Befehl) zu einem gelangen (zumal gewisse Browser keine fixe E-Mail-Adresse installiert haben, klappt dies eben leider nicht immer, gerade an der Uni). 

Es gibt einen guten Gratis-CGI-Service wie z.B. "Netzz", wo wir uns auch anzapfen werden bzw. uns bereits haben... 

Die Tags für die Formulare sind einfach zu beherrschen - in den HTML-Quellcode (!) einer Seite müssen folgende Tags eingebunden werden, wobei das ganze Formular hier in eine Tabelle mit der Breite 527 Pixel eingebettet wurde: 


<form action="http://www.nettz.de/Formular-Chef/Formular-Chef.cgi" method="post" enctype="multipart/form-data">  

<input type="hidden" name="betreff" value="Feedback Website">  
<input type="hidden" name="empfaenger" value="test@deineadressehiereintragen.com">
<!-- Unsichtbarer Kommentar: in der letzten Zeile statt der Beispieladresse DEINE Mailadresse einsetzen! -->
<input type="hidden" name="absender" value="topweb@testtest.domain">  
<input type="hidden" name="antwort_template_name" value="http://www.jacomet.ch/topweb/basic/answer.htm">  

<table WIDTH="527"><tr><td>  

<b><font face="ARIAL, HELVETICA, HELV, GENEVA" size="-1" >Dein Name oder Deine E-Mail-Adresse</font></b></td></tr>  

<tr><td>  

<input NAME="Name/Mail" TYPE="TEXT" SIZE="63" MAXLENGTH="50">  

</td></tr>  

<tr>  
<td></td>  
</tr>  

<tr>  
<td><b><font face="ARIAL, HELVETICA, HELV, GENEVA" size="-1">Deine Anregung, Kommentar, Frage, oder was auch immer:</font></b></td></tr>  

<tr><td>  

<input NAME="Kommentar" TYPE="TEXT" SIZE="63"  MAXLENGTH="300"></td></tr></table>  

<input TYPE="SUBMIT" VALUE="...und weg damit!">  
<input TYPE="RESET" VALUE="Reset">  

<br>  
<p><b><font face="ARIAL, HELVETICA, HELV, GENEVA" size="-1">Und nun ein klein wenig Geduld... der Versand kann manchmal einige Sekunden dauern; Du erh&auml;lst eine Best&auml;tigung. </font></b>  

</form>


Das heisst folgendes... 
 
 
<http://www.nettz.de/Formular-Chef/Formular-Chef.cgi" method="post" enctype="multipart/form-data"> Hier wird das Formular eingeleitet, die gewünschte Aktion festgesetzt (hier: ein CGI-Programm auf einem fremden Server, der dafür eingerichtet wurde) und die Übertragungs-Methode festlelegt ("post")
<input type="hidden" name="action" value="mailto">

...und andere ähnliche Tags...

Die einzelnen Felder, welche die Detials festelegen, z.B. an wen das Mail gehen soll, wie es übermittelt werden soll, was für eine Antwortseite angezeigt wird nach dem erfolgreichen Versand.
<input NAME="Name/Mail" TYPE="TEXT" SIZE="63" MAXLENGTH="50">

... und andere ähnliche Tags...

Die einzelnen Eingabefelder müssen Angaben über den Typ des Feldes enthalten, hier z.B. ein Textfeld mit einer Breite von 63 Pixeln und einer maximalen Aufnahmekapazität von 50 Zeichen.
<input TYPE="SUBMIT" VALUE="...und weg damit!"> Wenn man hier klickt, wird das Formular verschickt; das Feld ist mit "...und weg damit" beschriftet.
<input TYPE="RESET" VALUE="Reset"> Nichts anderes als der RESET-Knopf, der das Formular löscht
 

 


Aussehen tut das dann so... 

Dein Name oder Deine E-Mail-Adresse
 
Deine Anregung, Kommentar, Frage, oder was auch immer:

 

Und nun ein klein wenig Geduld... der Versand kann manchmal einige Sekunden dauern; Du erhälst eine Bestätigung. 

 
 

Es gibt auch noch andere Eingabefeld-Arten, z.B. Knöpfe für Bestellformulare.

Wenn Ihr das obige Formular verwenden wollt, nur zu - kopiert einfach den HTML-Quelltext, ersetzt aber das Antwortformular durch eine Eurer Pages (fakultativ) und die Beispiel-E-Mail-Adresse durch Eure eigene (obligatorisch, möglichst eine, auf die es nichts ausmacht, dass etwas mehr Spam kommt - denn eure Mailadresse ist dann offen im Netz sichtbar).

Wer wegen der Spamgefahr darauf verzichten will, eine Adresse im Netz zu veröffentlichen: Kein Problem, einfach melden, wenn ihr die Kursseite zur Bewertung "abgebt".

Wichtig ist, dass im Antwortformular nur absolute Links zu finden sind, d.h. die Grafiken usw. nicht einfach als "beispiel.jpg" dargestellt sind, sondern mit dem vollständigen Pfad, also z.B. "http://www.server.ch/kusrse/name/beispiel.jpg" - denn der Netzz-Server stellt die Seite auf seinem eigenen Server dar, ergänzt durch Werbung. Am einfachsten ist eine simple Antwortseite ohne Grafiken.

Mehr zu Formularen gibts natürlich in der Dokumentation! - Und weiter gehts hier...



Zur Hauptseite zurück gehts hier.



webpublishing | kurse+texte | fotos+webcam | sounds
blog | yakome'tt | projekte | kontakt

last update 15.05.2005 20:15 © jacomet.ch 1999-2005