During a recent microsite project I was tasked with creating a contact form in Flash – which is simple enough as there are plenty out there, unless you want to include elements such as checkboxes that is.
In this tutorial I will show you how to use the Flash checkbox components in conjunction with a little ASP script that does just what we are looking for.
Step 1: The Flash Form
First we need to create the flash form, you can either download the FLA file provided or create your own similar to the following, remember to set your text-areas as ‘input text’ if you do the latter.
Step 2: The Actionscript
In your timeline create 2 keyframes. The first keyframe will contain the contact form along with the code for generating the e-mail. The second keyframe will have the confirmation / thank you text.
Keyframe 1:
//Sets ‘txtName’ as the default text box. Specifies the elements tab-order
selection.setFocus(“txtName”);
txtName.tabIndex = 0;
txtCompany.tabIndex = 1;
txtEmail.tabIndex = 2;
ckone.tabIndex = 3;
cktwo.tabIndex = 4;
ckthree.tabIndex = 5;
btnSubmit.tabIndex = 6;
btnComment.tabIndex = 7;
var myCheckboxListener:Object = new Object();
// When the element ‘btnSubmit’ is pressed, execute the code
btnSubmit.onRelease = function (){
// Declares the variables
var msgRec = new LoadVars();
var formContact = new LoadVars();
formContact.varName = txtName.text;
formContact.varCompany = txtCompany.text;
formContact.varEmail = txtEmail.text;
if (ckone.selected)
{formContact.varone = “Option 1 – Checked”;}
else
{formContact.varone = “Option 1- Unchecked”;}
if (cktwo.selected)
{formContact.vartwo = “Option 2 – Checked”;}
else
{formContact.vartwo = “Option 2 – Unchecked”;}
if (ckthree.selected)
{formContact.varthree = “Option 3 – Checked”;}
else
{formContact.varthree = “Option 3 – Unchecked”;}
formContact.varComment = txtComment.text;
// Passes info to ‘contact-form.asp’
formContact.sendAndLoad(“contact-form.asp”, msgRec, “POST”);
// Jumps to the confirmation keyframe
gotoAndStop(2);
}
Step 3: The ASP
The ASP script is what we will use to generate and send an e-mail comprised of the variables passed across from Flash.
’If the Name field is not empty then process the form.
’ You can customise your own validation here.
if request(“varName”) <> “” then
’Creates the e-mail
BodyText = BodyText&“Completed contact form:”&vbcrlf&vbcrlf
BodyText = BodyText&“Name: “&vbcrlf &request(“varName”)&vbcrlf&vbcrlf
BodyText = BodyText&“Company: “
&vbcrlf&request(“varCompany”)&vbcrlf&vbcrlf
BodyText = BodyText&“Interested In:”
&vbcrlf&request(“varone”)&vbcrlf&vbcrlf
&vbcrlf&request(“vartwo”)&vbcrlf&vbcrlf
&vbcrlf&request(“varthree”)&vbcrlf&vbcrlf
BodyText = BodyText&“Comments / Questions:”
&vbcrlf&request(“varComment”)&vbcrlf
’Declare the email settings and sends the message
Dim MyMail
Set MyMail = Server.CreateObject(“CDONTS.NewMail”)
MyMail.From = “from@example.com”
MyMail.To = “to@example.com”
MyMail.Subject = “Contact Form Response”
MyMail.Body = BodyText
MyMail.Send
Set MyMail = Nothing
end if
%>
Note: If you are copying & pasting avoid having whitespace in your ASP code – if you are using the source files you dont need to worry about it :o).
For the source code download the FLA
The attached zip archive contains FLA, SWF, ASP and HTML files.