Formular Workshop
Lerne das Erstellen von HTML-Formularen für deinen Onlex-Formmailer
Ein Formular - verschiedene Empfänger
<script>
Mit JavaScript kann man erstaunliches tun: Mit einem einzigen Formular kann man eine Nachricht an unterschiedliche Empfänger schicken. Ende mit x Formularen für jeden Mitarbeiter aus dem Vorstand ;-)
Oder wenn man mehrere Benutzerkonten und Formmailer von Onlex.de zur Verfügung hat, kann man ganz einfach nur ein Formular mit verschiedenen Empfänger erstellen.
Hier ein Beispiel eines Formulars mit solch einer Funktion (anhand eMail-Adressen).
Es müssen alle mit einem (*) gekennzeichneten Formularfelder ausgefüllt werden.
Quelltext-Auszug (
<head>):
<script type="text/javascript">
<!--
function pruefen(){
var f = document.Kontakt;
var fehler = "";
if (f.empfaengerliste.selectedIndex==0){
fehler += "- den Empfänger auswählen\n";
}
if (f.empfaengerliste.selectedIndex==1){
f.action = "mailto:email1@domain1.tld";
}
if (f.empfaengerliste.selectedIndex==2){
f.action = "mailto:email2@domain2.tld";
}
if (f.empfaengerliste.selectedIndex==3){
f.action = "mailto:email3@domain3.tld";
}
if (fehler != ""){
var fehlertext = "Die folgenden Felder wurden nicht vollständig ausgefüllt:\n\n";
fehlertext += fehler;
alert(fehlertext + "\nBitte füll die Informationen noch aus. Danke.");
return false;
}
return true;
}
//-->
</script>
Quelltext-Auszug (
<body>):
<form action="" method="post" name="Kontakt" enctype="application/x-www-form-urlencoded" accept-charset="UTF-8" onsubmit="return pruefen()">
Empfänger*:<br>
<select name="empfaengerliste">
<option>Bitte Empfänger auswählen --></option>
<option>email1@domain1.tld</option>
<option>email2@domain2.tld</option>
<option>email3@domain3.tld</option>
</select>
<br>
Absender eMail-Adresse:<br>
<input type="text" name="eMail" size="30"><br>
Nachricht:<br>
<textarea name="Nachricht" cols="34" rows="5"></textarea>
Passwort- / Spamschutz: Bitte gib trowssap ein<br>
<input type="password" name="onlex_password" size="30" maxlength="15"><br>
<input type="submit" name="Senden" value="Daten absenden">
</form>
Im Event-Handler "
onsubmit" wurde der Code empfaenger() eingefügt. Hier wird eine Funktion beim Absenden (onsubmit) aufgerufen.Erläuterungen zum JavaScript-Code:
Im Script wird jetzt die Funktion
pruefen() gestartet. Es wird dann eine Variable definiert / kreiert:var f = document.Kontakt;.Damit spart man sich u.a. Schreibarbeit ;-)
document.Kontakt bezieht sich auf das aktuelle HTML Dokument und das HTML Element mit dem Wert im name Attribut Kontakt.In den nächsten Zeilen wird abgefragt, ob eine bestimmte Situation eingetroffen ist:
Wenn im Feld
empfaengerliste der 2. Eintrag ausgewählt (selectedIndex == 1) wurde, dann schreibe in das action-Attribut den Wert mailto:email1@domain1.tld.Das gleiche gilt für alle folgenden Felder.
Auffällig ist, dass der zweite Eintrag im Script mit "
1" deklariert wird. Das liegt daran, dass in JavaScript die Zählung bei 0 beginnt.Der obige Quelltext wurde zusätzlich mit einer Überprüfung der Auswahlliste versehen. Weitere Informationen findest du im Unterkapitel der Formularüberprüfung "Überprüfung von Auswahllisten".
Das Formular lässt sich jedoch beliebig mit weiteren Überprüfungen versehen. Ebenso können selbstverständlich mehr Formular-Elemente genutzt werden ;-)
Weitere Information zur Formularüberprüfung findest du im gleichnamigen Kapitel "Formularüberprüfung".
Anstatt eMail-Adressen zu nutzen, kann man hier auch die Adresse zum Formmailer von Onlex.de nutzen:
Bisher (mit eMail-Adresse):
if (f.empfaengerliste.selectedIndex==1){
f.action = "mailto:email1@domain1.tld";
}
Neu (mit Adresse zum Formmailer von Onlex.de):
if (f.empfaengerliste.selectedIndex==1){
f.action = "https://www.onlex.de/_formmailer.php4?username=user1";
}
Beachte: Wenn du mehrere Benutzerkonten mit Formmailer von Onlex.de nutzt und du in den betreffenden Konten den Passwortschutz aktiviert hast, dann sollte idealerweise das Passwort überall dasselbe sein.
↑ zum Seitenanfang ↑