Dieser Artikel erklärt die Erstellung eines einfachen Formmailers mit  Flash und PHP.
Zunächst erstellen wir einen MovieClip (mailform), in dem wir unser Formular unterbringen. Ich habe hier für jede Gruppe von Objekten eine eigene Ebene angelegt:
-> Überschriften (title)
-> Eingabefelder (fields)
-> Schaltflächen (buttons)
-> Anzeigefenster (display)
-> sowie eine Ebene für das Script (code)
Die Eingabefelder erhalten sinvolle Instanznamen:
-> Vorname (msg_forename)
-> Nachname (msg_lastname)
-> telefon (msg_tel)
-> e-mail (msg_mail)
-> Nachricht (msg_message)
Das Textfeld für die Nachrichten erhält den Instanznahmen "display". Dort werden Fehler- und Erfolgsmeldungen ausgegeben.
Wir benötigen zwei Schaltflächen, um die Nachricht zu verschicken und das Formular zu löschen. Hierzu erstellen wir einen MovieClip (button), der lediglich zwei Schlüsselbilder (für ein einfaches rollOver) enthält. Im ersten Schlüsselbild habe ich eine weiße Hintergrundfläche und im zweiten eine dunkle erstellt. Zusätzlich erstellen wir ein dynamisches Textfeld für die Beschriftung, das den Instanznamen "btext" (für "button Text") erhält. In der Ebene "steering" setzen wir in jedes der beiden Schlüsselbilder ein "stop()", um den Clip anzuhalten.
Wir erstellen eine Ebene für das Script (code), in der wir das Verhalten beim RollOver und die Zuweisung der Beschriftung festlegen:
this.tabEnabled = false; // Tabstopp für die Buttons unterbinden
this.onRollOver = function() {
gotoAndStop(2); // Zweites Bild anzeigen beim rollOver
}
this.onRollOut = this.onReleaseOutside = function() {
gotoAndStop(1); // beim rollOut (und beim Loslassen außerhalb) erstes Bild anzeigen
}
function setText(txt) { // Funktion zum Zuweisen der Beschriftung
this.btext.text = txt;
}
Nun können wir zwei Instanzen dieses MovieClips in unser Formular einfügen. Wir vergeben für die Buttons die Instanznamen "but1" und "but2".
Jetzt benötigen wir einige Funktionen, um das Formular zu steuern und zu verschicken. Wir öffnen den AS-Editor in der Ebene "code" und beginnen mit der Zuweisung der Buttonbeschriftungen:
this.onEnterFrame = function() {
but1.setText("Löschen"); // Beschriftungen zuweisen
but2.setText("Abschicken");
delete this.onEnterFrame; // Handler löschen
}
Diese Zuweisung setze ich deshalb in eine onEnterFrame-Methode, da Memberfuntionen von MovieClips erst nach dem Anzeigen des ersten Bildes zur Verfügung stehen. Wir warten also auf das erste Bild und löschen dann den Handler wieder.
Wir wollen in den einzelnen Eingabefeldern nicht alle Zeichen zulassen, daher schreiben wir eine kurze Funktion, um diese Felder zu beschränken und rufen diese gleich auf:
restrictFields(); // Funktionsaufruf zum Beschränken der Textfelder
function restrictFields() {
// In den Namen nur Buchstaben, den Punkt und den Bindestrich zulassen:
msg_forename.restrict = msg_lastname.restrict = "a-zA-Z.\\-öäüÖÄÜß";
// In der Telefonnummer nur Zahlen, den Schrägstrich und den Punkt zulassen:
msg_tel.restrict = "0-9/\\- ";
// In der e-Mail-Adresse nur Buchstaben, den Punkt, Binde- und Unterstrich und das @-Zeichen zulassen:
msg_mail.restrict = "a-zA-Z0-9_\\-.@";
}
Vor dem Versenden überprüfen wir die Eingaben rudimentär auf Gültigkeit. So eine Prüfung kann sehr streng (und daher umfangreich) ausfallen; für dieses Beispiel beschränken wir uns auf einige grundlegende Anforderungen für die Eingaben. Hierzu schreiben wir eine Funktion namens "checkForm()":
function checkForm() {
var error = 0; // Variable, die die Eingabefehler bitweise codiert enthält
// Jeder mögliche Fehler erhält hier ein Bit in dieser Variable
error += (msg_lastname.text.length < 2)? 1 : 0; // Namen sollten mindestens zwei Zeichen lang sein
error += (msg_forename.text.length < 2)? 2 : 0;
error += (msg_tel.text.length < 4)? 4 : 0; // die Telefonnummer sollte mindestens 4 Zeichen enthalten
error += (msg_mail.text.length < 10)? 8 : 0; // und die e-Mail-Adresse mindestens 8
// wir testen nur, ob das @ und der Punkt nicht zu weit vorne oder hinten in der Adresse liegen.
// Zusätzlich kann man auf die richtige Reihenfolge und Anzahl dieser Zeichen testen, aber ich möchte dieses
// Beispiel an dieser Stelle kurz halten.
error += (msg_mail.text.indexOf("@") < 3 || msg_mail.text.lastIndexOf("@") > msg_mail.text.length - 4) ? 16 : 0;
error += (msg_mail.text.indexOf(".") < 3 || msg_mail.text.lastIndexOf("@") > msg_mail.text.length - 2) ? 32 : 0;
error += (msg_message.text.length < 2) ? 64 : 0;
return error; // wir geben den Fehlerwert zurück. Ist diese Variable 0, so sind keine Fehler erkannt worden.
}
Nun benötigen wir eine Funktion, die anhand dieser Fehlernummer entsprechende Meldungen ausgibt. Wir nennen diese Funktion "errorMsg()" (für "Error Message"):
function errorMsg(error) {
var estr = ""; // Rückgabestring initialisieren
// Zum Testen der einzelnen Bits verschieben wir den Wert um die entsprechende Anzahl Bits und
// ziehen ggf. den jeweiligen Bitwert ab:
if (error >> 6) {estr += "\n> Geben Sie eine Nachricht ein"; error -= 64;}
if (error >> 5) {estr += "\n> ungültige Domain in der eMail-Adresse"; error -= 32;}
if (error >> 4) {estr += "\n> ungültige eMail-Adresse"; error -= 16;}
if (error >> 3) {estr += "\n> Geben Sie eine eMail-Adresse ein"; error -= 8;}
if (error >> 2) {estr += "\n> Geben Sie eine Telefonnummer ein"; error -= 4;}
if (error >> 1) {estr += "\n> Geben Sie Ihren Vornamen ein"; error -= 2;}
if (error >> 0) {estr += "\n> Geben Sie Ihren Nachnamen ein";}
return estr; // Rückgabe der Zeichenkette
}
Am wichtigsten ist natürlich die Funktion zum Verschicken des Formulars (sendForm()), die auch gleichzeitig die Überprüfung durch Aufruf der bisher geschriebenen Funktionen übernimmt:
function sendForm() {
var error = checkForm(); // Rückgabe der Funktion checkForm speichern
if (error == 0) { // Wenn kein Fehler aufgetreten ist, wird das Formular verschickt
var LV = new LoadVars(); // Wir legen ein LoadVars-Objekt an, um das Senden und Empfangen zu ermöglichen
// und weisen diesem die Werte unserer Eingabefelder zu. Wir "escapen" diese Werte, das heißt wir wandeln sie
// für den Versand in URL-encodierte Zeichenketten um:
LV.msg_lastname = escape(msg_lastname.text);
LV.msg_forename = escape(msg_forename.text);
LV.msg_tel = escape(msg_tel.text);
LV.msg_mail = escape(msg_mail.text);
LV.msg_message = escape(msg_message.text);
// mit der Funktion sendAndLoad senden wir die Daten an unser PHP-Script und empfangen
// gleichzeitig eine Antwort:
LV.sendAndLoad("mailto.php", LV, "POST");
// Wenn eine Antwort empfangen wurde, geben wir eine entsprechende Meldung aus:
LV.onLoad = function() {
display.text = "\n> ";
if (this.answer != undefined) { // Wenn eine gültige Antwort empfangen wurde (Variable "answer") ...
display.text += unescape(this.answer); // geben wir diese aus.
} else { // andernfalls ...
display.text += "Ein unbekannter Fehler ist aufgetreten!"; // geben wir eine Standartmeldung aus
}
// unser Script gibt zusätzlich eine Variable (success) aus, wenn das Senden erfolgreich war:
if (this.success == "true") clearForm(); // wir löschen dann das Formular
}
} else { // Wenn Eingabefehler bemerkt wurden ...
display.text = errorMsg(error); // geben wir die entsprechende Meldung aus.
}
}
Zuletzt benötigen wir eine kleine Funktion, die das Löschen der Eingabefelder übernimmt:
function clearForm() {
msg_lastname.text = "";
msg_forename.text = "";
msg_tel.text = "";
msg_mail.text = "";
msg_message.text = "";
}
Jetzt können wir unseren Schaltflächen die gewünschten Aktionen zuweisen. Wir markieren den ersten Button (Löschen) und lassen ihn die entsprechende Funktion aufrufen:
on(release) {
_parent.clearForm(); // _parent liefert einen Verweis auf das übergeordnete Objekt, sprich: das Formular
}
Genauso verfahren wir mit dem zweiten Button:
on(release) {
_parent.sendForm();
}
Der Flash-Teil unseres Formulars ist nun fertig - wir können den MC "mailform" auf der Bühne instanzieren.
Zuletzt benötigen wir ein kleines PHP-Script, um die Nachricht tatsächlich zu versenden. Ein derartiger Formmailer kann je nach Bedarf mehr oder weniger umfangreich ausfallen (etliche Varianten kursieren im Netz); ich beschränke mich an dieser Stelle auf das absolute Minimum und verweise gegebenfalls auf den PHP-Bereich hier auf computer-tipps.net.
Wir öffnen einen Text- bzw. html-Editor und schreiben ein kurzes Script, das wir als "mailto.php" abspeichern:
<?php
$answer = "Keine Daten zum Verschicken"; // Standartantwort (wenn z.B. keine Daten in $_POST vorliegen
if (isset($_POST["msg_message"])) { // Wenn eine Nachricht vorliegt ...
// Zusammensetzen der Mail aus den einzelnen Variablen:
$msg = "Nachricht von: ".urldecode($_POST["msg_forename"])." ".urldecode($_POST["msg_lastname"])."\n";
$msg .= " Telefon: ".urldecode($_POST["msg_tel"])."\n";
$msg .= " e-Mail: ".urldecode($_POST["msg_mail"])."\n\n";
$msg .= urldecode($_POST["msg_message"]);
$msg = utf8_decode($msg);
if (mail("mein_name@mein_server.de", "Formmailer", $msg) == true) {
echo("success=true&"); // Zurückgeben von "true", wenn die Mail akzeptiert wurde
$answer = "Ihre Nachricht wurde verschickt"; Positive Meldung
} else {
$answer = "Ihre Nachricht konnte nicht verschickt werden"; // Fehlermeldung
}
}
echo("answer=".urlencode($answer)); // Ausgabe der Meldung
?>
Autor: Datic
Website: Ekto.net
|
MEMBERS LOGIN
SEITE DURCHSUCHEN
