Email contact form - AS3 & PHP


Har du haft brug for en kontakt formular? Denne tutorial viser dig hvor let det er, selv at bygge en.

Intro

Nu har emnet været oppe en del gange: "hvordan laver man en contact form i flash?".
Så nu besluttede jeg mig for at lave min første tutorial her på Flash Forum.
Jeg viser hvordan du sender data fra din Swf til en php fil, og så sender mailen fra php.

færdig version

Tutorial

Først laver du en ny AS3 flash fil. Så laver du 3 input felter som du giver instance navene:
navnInput, emailInput, og beskedInput. Ud for input felterne kan du lave 3 textfelter hvor du skriver feks: dit navn, din mail osv.
Under dem laver du et dynamisk text felt (Dynamic text field) som du kalder statusText.

Alle tekstfelter embeder du, ved at markere tekst feltet, og trykke på knappen embed, og så markere du:
-lower case
-upper case
-numbers
-punctional (%&()€)

og skriver ÆØÅåøæ i feltet: "include these characters"

Så laver du en knap, feks en firkant og et textfelt for der står: "Send"
Du giver knappen instance navnet sendKnap.

Nu mangler vi bare at lave AS koden og php filen.

ActionScript

System.useCodePage = true;//Gør at du undgår problemer med æøå
var emailData:URLVariables = new URLVariables();//holder vores data som sendes til php'en
var request:URLRequest;//vores url request
var loader:URLLoader = new URLLoader();//URLLoaderen sender data'en til php
 
sendKnap.addEventListener(MouseEvent.CLICK, sendMail);//"Lytter" om der bliver trykket på knappen "sendKnap"
loader.addEventListener(Event.COMPLETE, emailSendt);//Lytter efter hvornår mailen er sendt
 
function sendMail(e:Event):void
{
//Checker om der er indtastet noget i alle felterne med valider() functionen, som vi laver nede under.
	if(valider()){
 
	statusField.text = "Vent venligst sender mail...";//Skriver at mailen sendes
	//Tilføjer hvad der står i input felterne til vores URLVariabler
	emailData.navn = navnInput.text;
	emailData.email = emailInput.text;
	emailData.besked = beskedInput.text;
 
	request = new URLRequest("email.php");//Siger hvor php filen ligger
	request.method = URLRequestMethod.POST;//Fortæller at dataen skal sendes som POST variabler
	request.data = emailData;//Tilføjer URLVariablerne til vores request
	loader.load(request);//Sender dataen til php filen
 
	}
        else
        {
		statusField.text = "Udfyld alle felter, tak.";//Skriver at man skal udfylde alle felter
	}
}
 
function valider():Boolean{
 
        //Checker om alle felterne er blevet udfyldt
 
	if(navnInput.text != "" && emailInput.text != "" && beskedInput.text != ""){
		return true;//true, der noget i alle felter
	}else{
		return false;//retunere false, der er ikke skrevet i alle felterne
        }
 
}
 
 
//Denne function "Kører" når mailen er blevet sendt
function mailSendt(e:Event){
	trace("mail sendt")
	statusField.text = "Din besked er nu sendt!"//Skriver at mailen er sendt i vores statusField
	navnInput.text = "";//tømmer input feltet
	emailInput.text = "";//tømmer input feltet
	beskedInput.text = "";//tømmer input feltet
}

Og for at lave php filen skal du åbne: Note pad, Text Mate, eller Dreamweaver. Men ikke programmer som Pages eller Word, For de vill føje alle mulige textformateringer som vi ikke ønsker.

Og insætter denne kode:

PHP

<?php
$sendTo = "dinMail@dinHost.dk";//Vi laver en variabel som siger hvor mailen skal sendes til
$subject = "hvad der skal stå i emne Feltet";//Her sriver vi hvad der skal stå i emne feltet
 
$headers = "From: " . "Min mail form " . "<" . $_POST["email"] .">";//her siger vi hvad ders kal stå i headeren, hvor mailen er fra. vi får malen ved at skrive $_POST["email"]
 
$message = "Fra: ". $_POST["navn"] . "\n\n" . $_POST["besked"];//her siger vi hvad der skal stå i mailen først "Fra:" og så skriver vi et punktum som svarer til et + i as. Og så hvad han hedder som har sendt mailen. Så et linje skift ved at skrive "\n\n" Og så får vi fat i beskeden ved at skrive $_POST["besked"] .
 
mail($sendTo, $subject, $message, $headers);//Sender mailen med vores variabler
?>

Og så er det bare at smide mail.swf og email.php op på din server og se om det virker.

Håber du kunne bruge denne tutorial, og der ikke var for mange stave fejl.

I må endelig spørger hvis i har spørgsmål til tutorialen.

I kan finde source filerne her

-Jakob Halskov

Flash, Flash & Photoshop.
16 år Århus

Bilag

FilnavnStørrelse
mailform.zipmailform.zip20.01 kB
Om forfatteren
User picture

Jakob Halskov er 15 år gammel og har arbejdet med Flash i lidt over 4 år nu.
Han er udvikler også php og iPhone apps.

Kommentarer

Se creativeskills's brugerprofilcontributer
Indmeldt: 07-12-2006
Indlæg: 129
Er offline

God tutorial! Lad os få noget mere med PHP interation som backend!

Dennis Madsen
----------------###---------------------
www.creativeskills.dk

Hallo, From the CreativeMonkey

Se Thonbo's brugerprofilcontributer
Indmeldt: 12-06-2007
Indlæg: 655
Er offline

PHP er for smalltimers Razz

.NET er for de tunge drenge Very Happy

ik fordi jeg kan noget af det selv Razz Confused

anyways - sweet at se så meget udvikling i as3 af folket - glæder mig lidt til at blive kastet ud i det kommercielle as3 liv snart - føler selv je snart er rustet nok til opgaven Very Happy

:: Thonbo.com @ NoZebra
latest work @ NoZebra Reel 2010: http://bit.ly/96w5zE
http://thonbo.com || http://nozebra.dk
http://twitter.com/thonbo || Dansk Flashlaug - anno 1633 @ http://bit.ly/bz5THq

Se bloop's brugerprofil
Indmeldt: 24-12-2007
Indlæg: 339
Er offline

@thonbo:

whatever works 4 u, og good luck - denne tråd var jo blot en tutorial, med plads til forbedringer, som så meget andet! Very Happy

Se jakobhs's brugerprofilcontributer
Indmeldt: 10-01-2007
Indlæg: 1125
Er offline

God tutorial! Lad os få noget mere med PHP interation som backend!

Hej tak.

Jeg er igang med at lave noget Flash cms.
når det er færdigt så laver jeg en PHP, Mysql, AS3, CMS tutorial.. Er der nogle som er intresseret i det?

-Jakob

Flash, Flash & Photoshop.
16 år Århus

Se ddennis's brugerprofil
Indmeldt: 28-11-2005
Indlæg: 207
Er offline

det lille "System.useCodePage = true" hack du bruger, er det blevet god praksis i AS3. Kan huske at Colin Moock beskrev de problemer dette medførte. Kan desværre ikke finde links til artiklerne, det skulle vist helt sikkert skabe problemer på en mac.

Er der nogen som ved om det er ikke stadig er god praksis.
alternativt kan man vel esacpe det?

/Dennis

Se jakobhs's brugerprofilcontributer
Indmeldt: 10-01-2007
Indlæg: 1125
Er offline

Hvilke problemer er det, det kan medfører?

Flash, Flash & Photoshop.
16 år Århus

Se Thulstrup's brugerprofiladministrator
Indmeldt: 02-06-2005
Indlæg: 923
Er offline

Dennis: Er det den her du tænker på?
http://www.moock.org/asdg/technotes/againstUseCodePage/

Når man bruger useCodePage, vil det kun virke for systemer der benytter samme codePage. Hvis et system benytter en anden codePage vil de se et andet resultat.

Den universelle løsning er at UTF8 encode teksten.

Det gøres sådan her i PHP:
$str = utf8_encode($str);

Se ddennis's brugerprofil
Indmeldt: 28-11-2005
Indlæg: 207
Er offline

Yes - Thulstrup fandt artiklen.
http://www.moock.org/asdg/technotes/againstUseCodePage/

Tak for php fix.

/Dennis

Se jakobhs's brugerprofilcontributer
Indmeldt: 10-01-2007
Indlæg: 1125
Er offline

Så siger man bare: $besked = utf8_encode("$_POST['besked']"); ?

Flash, Flash & Photoshop.
16 år Århus

Se Thulstrup's brugerprofiladministrator
Indmeldt: 02-06-2005
Indlæg: 923
Er offline

Ja, lige bortset fra dine anførselstegn.

Desuden kan det også være en ide at kører beskeden gennem PHP's nl2br funktion, som tilføjer et break-tag før alle newlines. Ellers kan man få problemer med at linieskift forsvinder i mailen.

$besked = nl2br(utf8_encode($_POST['besked']));

Men test hellere koden, for jeg vil ikke love dig at det virker Smile

Se creativeskills's brugerprofilcontributer
Indmeldt: 07-12-2006
Indlæg: 129
Er offline

Thonbo - Sjovt emne PHP VS. .NET?
Jeg tro alt ud for formålet med projektet at man skal vælge site backend efter det.
Da .NET kan være en tung del i udviklingsbudget - og php kan være en simple og billigere vej.
Men klar der er fordele med .NET!!

Dennis Madsen
----------------###---------------------
www.creativeskills.dk

Hallo, From the CreativeMonkey

Se Lightbulb's brugerprofil
Indmeldt: 03-09-2008
Indlæg: 31
Er offline

Super fedt! Mange tak for denne flotte beskrivelse jakobhs! Jeg har virkelig lært meget ved at følge den.

Fandt endda et par småfejl Very Happy Men igen, det jo bare med til at sætte hjernen lidt i gang.

Ellers flot beskrevet og let at forstå for selv en noob som mig.

Se Staebler's brugerprofil
Indmeldt: 25-06-2008
Indlæg: 5
Er offline

Hej.

Undskyld hvis jeg spørger dumt. Men er ikke så god til flash, så falmer lidt i blinde Smile

Men når man fx åbner dreamweaver og vælger PHP, skal man så skrive den tekst du har skrevet ind mellem de to "body" ? ellr skal mn slette alt den tekst den selv skriver, og KUN skrive præcis det du har skrevet?

tak
Smile

Se jakobhs's brugerprofilcontributer
Indmeldt: 10-01-2007
Indlæg: 1125
Er offline

Hej Staebler

du sletter bare det DW selv laver, det er hvis du skulle lave en html side med PHP

-Jakob Halskov

Flash, Flash & Photoshop.
16 år Århus

Se Lone71's brugerprofil
Indmeldt: 11-03-2008
Indlæg: 55
Er offline

Fedt, fik endelig lavet min mail formular på bagrund af dette, så takker......

Vh Lone

Se missb's brugerprofil
Indmeldt: 19-05-2009
Indlæg: 2
Er offline

... Har fundet løsningen....

Se oLiJe's brugerprofil
Indmeldt: 19-06-2008
Indlæg: 9
Er offline

Hvor kan jeg finde en guide til at opsætte min local host så den kan sende mails?

Jeg bruger XAMPP og har en Gmail-konto.

Jeg håber der er nogen der kan hjælpe...

mvh Ole

PS. Tak for tutorial'en Smile Fedt at lære om PHP og AS3 interaktion.

Se oLiJe's brugerprofil
Indmeldt: 19-06-2008
Indlæg: 9
Er offline

Er der nogen som ved hvordan man bruger denne form på one.com (hosting)??

De kræver at man bruger et cgi-script som action istedet for php-filen. Men derved kan man jo ikke specificere recipient, subject m.v.

Er der nogen som har prøvet at lave det med one.com som vil hjælpe?

Se jakobhs's brugerprofilcontributer
Indmeldt: 10-01-2007
Indlæg: 1125
Er offline

Mit eksempel virker perfekt på min server, også en one.com server.

Hvorfor vil du bruge et cgi-script istedet for php?

-Jakob

Flash, Flash & Photoshop.
16 år Århus

Se oLiJe's brugerprofil
Indmeldt: 19-06-2008
Indlæg: 9
Er offline

Fordi at one.com kræver at man bruger deres cgi script ved mail forms.

Chattede med deres support idag, han skrev at man ikke kunne bruge php men kun html...

Jakob: Hvad gør jeg galt? Jeg har fulgt din tut til punkt og prikke. Scriptet slutter med at skrive at mailen er blevet sendt, men der kommer aldrig en mail frem...

Se oLiJe's brugerprofil
Indmeldt: 19-06-2008
Indlæg: 9
Er offline

OK så virker det endelig...

Jeg oprettede en mail på one.com. Denne satte jeg til at redirecte alt til min gmail. Jeg indsatte one.com-mailen i PHP - og voila, så kom den frem til gmail!

Det er bare mærkeligt at man ikke kan maile direkte til gmail (fra en form). Har også prøvet fra domaindirect - også uden held.

Er der nogen som ved hvorfor?

/ O

Se nigelaj's brugerprofil
Indmeldt: 23-10-2008
Indlæg: 117
Er offline

Uhm guys,
sidder og prøver at lave det her i oop, men er så "heldig" at flash ikke vil genkende "URLRequestMethod.POST;"
Fejlen er som følgende:
"1120: Access of undefined property URLRequestMethod."

A little help here? Smile

/-\-/-\-/-\
Lige meget, glemte at importere "import flash.net.URLRequestMethod;" xD
I feel kinda stupid Smile

Det bedste tidspunkt at plante et træ, var for 100 år siden.
Det næstbedste er I DAG!