22.2 Kontaktformular 

Wie üblich haben wir im Flash-Bereich bereits Vorbereitungen getroffen, Sie müssen im Wesentlichen nur den ActionScript-Code ergänzen.

Schritt für Schritt: Ein Kontaktformular erstellen

Öffnen Sie die Datei versenden.fla von der CD-ROM. Dort finden Sie ein Kontaktformular in mehreren Bildern.

Werfen Sie einen Blick auf das eigentliche Kontaktformular in Bild 1. Sie sehen eine Reihe von dynamischen Textfeldern: Nachname (nachname_str), Vorname (vorname_str), Betreff (betreff_str), Anfrage (anfrage_str), E-Mail (email_str) und Telefon (telefon_str). Zum Versenden des Formulars dient die Schaltfläche senden_btn.

Abbildung 22.2 Das Kontaktformular (noch unausgefüllt)

Als Nächstes müssen Sie dafür sorgen, dass die Versenden-Schaltfläche erst aktiviert wird, wenn in allen Textfeldern etwas steht. Das erledigt folgender Code:

stop();
senden_btn.enabled = false;
var id_number:Number = setInterval(pruefen, 250);
function pruefen() {
   var ok:Boolean = true;
   if (nachname_str == null ||
      vorname_str == null ||
      betreff_str == null ||
      anfrage_str == null ||
      email_str == null ||
      telefon_str == null) {
      ok = false;
   }
   if (senden_btn.enabled != ok) {
      senden_btn.enabled = ok;
   }
}

Anfangs ist die Schaltfläche deaktiviert (senden_btn.enabled = false). Dann wird periodisch die Funktion pruefen() aufgerufen, die alle Formularfelder überprüft und gegebenenfalls die Schaltfläche freigibt.

Sobald der Nutzer die Schaltfläche anklickt, soll auf die nächste Seite des Formulars weitergeleitet werden. Das geschieht mit folgendem Code:

on (release) {
   gotoAndStop(5);
}

Ab Bild 5 gibt es im Flash-Film eine Bestätigungsseite, in der die Formulareingaben wiederholt werden. Wenn Sie einen kurzen Blick auf die Variablennamen der dynamischen Textfelder werfen, stellen Sie fest, dass diese identisch sind mit den Variablennamen im Kontaktformular. Konsequenz: Diese Felder werden im Voraus automatisch mit den richtigen Werten ausgefüllt, eine große Zeitersparnis.

Abbildung 22.3 Die Bestätigungsseite (bis jetzt noch leer)

Die beiden Schaltflächen müssen Sie noch mit Funktionalität belegen. Bei der Zurück-Schaltfläche soll der Film an den Anfang zurückspringen:

on (release) {
   gotoAndStop(1);
}

Die Bestätigen-Schaltfläche dagegen springt zu Bild 10:

on (release) {
   gotoAndStop(10);
}

Die letzte »Seite« des Kontaktformulars, die Bestätigungsseite ab Bild 15, enthält nur einen Bestätigungstext, keine dynamischen Textfelder mehr.

Abbildung 22.4 Die Ergebnisseite (sie ist immer so leer)

In Bild 10 sollten Sie die Formulardaten an ein serverseitiges Skript senden.Die Übergabe der Daten ist nicht weiter schwierig, da sie komplett in dynamischen Textfeldern vorliegen. Der Code beschränkt sich auf einen einfachen Aufruf von loadVariables():

loadVariables("flash.php", "", "POST");

Nun benötigen Sie ein PHP-Skript, das die Daten per E-Mail verschickt. Aus Gründen der Einfachheit wählen wir einen allgemeinen Ansatz, bei dem alle POST-Daten ausgegeben und per Mail gesendet werden. Sie benötigen dazu ein korrekt konfiguriertes PHP, das in der Lage ist Mails zu verschicken. Hier der Code des PHP-Skripts flash.php:

<?php
  $betreff = (isset($_POST['betreff_str'])) ? $_POST['betreff_str'] : '';
  ob_start();
  print_r($_POST);
  $daten = ob_get_contents();
  ob_end_clean();
  mail('webmaster@xy.de',
   $betreff,
   $daten);
?>

Ändern Sie webmaster@xy.de in Ihre eigene E-Mail-Adresse um. Außerdem müssen Sie gegebenenfalls PHP entsprechend konfigurieren. Dazu finden Sie in der PHP-Konfigurationsdatei php.ini einen Abschnitt [mail], in dem Sie entsprechende Angaben machen können. Das ist insbesondere bei einer lokalen PHP-Installation erforderlich; bei einem Webhoster übernimmt das in der Regel der Provider für Sie.

Kopieren Sie sowohl die Datei flash.php als auch die SWF-Datei des Films in ein Verzeichnis auf dem Webserver. Falls Sie zusätzlich von Flash eine HTML-Datei erstellen ließen, die die SWF-Datei einbindet, kopieren Sie die Datei mit.

Rufen Sie den Film im Webbrowser auf. Dabei müssen Sie über den Webserver gehen, also beispielsweise http://servername/datei.swf aufrufen. Füllen Sie das Formular aus, schicken Sie es ab und warten Sie darauf, dass die E-Mail bei Ihnen eintrifft.

Abbildung 22.5 Die automatisch erzeugte Mail; der Betreff wurde übernommen

Ein komplett lauffähiges Beispiel finden Sie in der Datei versenden_AS2.fla bzw. versenden_AS1.fla, ebenso das fertige Skript flash.php.

Es ist übrigens wichtig, dass Sie das Beispiel über einen Webserver abspielen lassen. Falls Sie das nicht tun und die SWF-Datei per Dateisystem aufrufen (etwa C:\Verzeichnis\Dateiname.swf), klappt der Aufruf des Skripts nicht. Wenn Sie das innerhalb von Flash versuchen, erscheint im Ausgabe-Fenster sogar eine entsprechende Warn- beziehungsweise Fehlermeldung.

Abbildung 22.6 Fehler beim Aufruf per Dateisystem und ohne Webserver

Die hier gezeigte Kontaktaufnahme ist natürlich nur ein Beispiel. Wenn Sie mit den Autoren dieses Buches Kontakt aufnehmen möchten, finden Sie unter http://www.hauser-wenz.de/support Updates zum Buch sowie ein Kontaktformular – zwar ohne Flash, aber wir antworten trotzdem.

Ihre Meinung

Wie hat Ihnen das Openbook gefallen? Wir freuen uns immer über Ihre Rückmeldung. Schreiben Sie uns gerne Ihr Feedback als E-Mail an kommunikation@rheinwerk-verlag.de.