Storing data in DataBase with Flash CS3

[Flep]

Often happens that we are developing a website with Adobe Flash to a client and / or friend and it's required to store the data of users via a form.
How to do?
This tutorial will try to explain to less experienced how to enter data into a database ( mySQL) by Flash.

First we need to reaffirm the notion that Flash and mySQL can not communicate directly.
Need a server-side scripts (in this case PHP) that receives data from Flash and then insert them in the database.

I've created an example using a form in Flash that sends data to a PHP script (name, first name, address, city, state, email) which in turn will store them in the database.

First of all we must create a new table in our DB: in this case a table called "clients" with 7 columns (ID, name, surname, address, city, state, email).

The file. Sql to create the necessary table is as follows:

CREATE TABLE `clients` (
`ID` INT NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`name` TEXT NOT NULL ,
`surname` TEXT NOT NULL ,
`address` TEXT NOT NULL ,
`city` TEXT NOT NULL ,
`state` TEXT NOT NULL ,
`email` TEXT NOT NULL
) ENGINE = MYISAM ; 

I create a form in Flash as follows:
-- Six static text fields that contain the titles (name, surname, address, city, state, email)
-- Six input text fields in which the user will insert his informations
-- A dynamic text field that will display any messages for user (for example if it has not completed all fields)
-- A button for sending data

Here it is:

The Document Class ( Main.as ) contains the following code:

/*
 *************************************
 * Data Store Flash CS3 + PHP  
 * http://www.FlepStudio.org         
 * Author: Filippo Lughi           
 * version 1.0                       
 *************************************
 */
package org.FlepStudio
{
	import flash.display.*;
	import flash.events.*;
	import flash.text.*;
	import flash.utils.*;
	import flash.net.*;
	import caurina.transitions.Tweener;
	
	public class Main extends MovieClip
	{
		private var email_checker:CheckEmail;
		
		private var timer:Timer;
		
		private var film_mc:MovieClip;
		
		public static var _Name:String;
		public static var _Surname:String;
		public static var _Address:String;
		public static var _City:String;
		public static var _State:String;
		public static var _Email:String;
		
		public function Main()
		{
			addEventListener(Event.ADDED_TO_STAGE,init);
		}
		
		private function init(evt:Event):void
		{
			removeEventListener(Event.ADDED_TO_STAGE,init);
			
			form_mc.x=stage.stageWidth+10;
			
			stage.frameRate=31;
			
			email_checker=new CheckEmail();
			
			moveInForm();
			addButtonListener();
		}
		
		private function moveInForm():void
		{
			Tweener.addTween(form_mc,{x:stage.stageWidth/2-form_mc.width/2,time:0.7,transition:"easeOutElastic"});
		}
		
		private function addButtonListener():void
		{
			form_mc.send_btn.addEventListener(MouseEvent.MOUSE_DOWN,checkFields);
		}
		
		private function checkFields(evt:MouseEvent):void
		{
			if(email_checker.initCheck(form_mc.email_txt.text))
			{
				if(form_mc.name_txt.text!=''&&form_mc.surname_txt.text!=''&&form_mc.address_txt.text!=''&&form_mc.city_txt.text!=''&&form_mc.state_txt.text!='')
				{
					showWorking();
					_Name=form_mc.name_txt.text;
					_Surname=form_mc.surname_txt.text;
					_Address=form_mc.address_txt.text;
					_City=form_mc.city_txt.text;
					_State=form_mc.state_txt.text;
					_Email=form_mc.email_txt.text;
					
					var send_data:StoreData=new StoreData(this);
				}
				else
					displayError("fill in all the fields please");
			}
			else
				displayError("invalid e-mail");
		}
		
		private function displayError(s:String):void
		{
			form_mc.error_txt.text=s;
			hideError();
		}
		
		private function hideError():void
		{
			timer=new Timer(2500,1);
			timer.addEventListener(TimerEvent.TIMER,deleteError);
			timer.start();
		}
		
		private function deleteError(evt:TimerEvent):void
		{
			form_mc.error_txt.text='';
		}
		
		private function showWorking():void
		{
			film_mc=new MovieClip();
			film_mc.graphics.beginFill(0xFFFFFF,0.7);
			film_mc.graphics.drawRect(0,0,stage.stageWidth,stage.stageHeight);
			addChild(film_mc);
		}
		
		public function hideWorking():void
		{
			removeChild(film_mc);
			
			displayError("Data has been stored");
			
			reset();
		}
		
		private function reset():void
		{
			form_mc.name_txt.text='';
			form_mc.surname_txt.text='';
			form_mc.address_txt.text='';
			form_mc.city_txt.text='';
			form_mc.state_txt.text='';
			form_mc.email_txt.text='';
			
			form_mc.x=stage.stageWidth+10;
			
			moveInForm();
		}
	}
}

At the following line:
var send_data:StoreData=new StoreData(this);
I instance a new class with name StoreData, this class will send data to PHP.
It's the following code:

/*
 *************************************
 * Data Store Flash CS3 + PHP  
 * http://www.FlepStudio.org         
 * Author: Filippo Lughi           
 * version 1.0                       
 *************************************
 */
package org.FlepStudio
{
	import flash.events.*;
	import flash.net.*;
	import flash.display.MovieClip;
	
	public class StoreData
	{
		private var request:URLRequest=new URLRequest('http://www.flepstudio.org/swf/ImmagazzinareDati/storeData.php');
		
		private var _fla:MovieClip;
		
		public function StoreData(fla:MovieClip)
		{
			_fla=fla;
			
			sendToPHP();
		}
		
		private function sendToPHP():void
		{
			var variables:URLVariables=new URLVariables();
			variables.name=Main._Name;
			variables.surname=Main._Surname;
			variables.address=Main._Address;
			variables.city=Main._City;
			variables.state=Main._State;
			variables.email=Main._Email;
			request.method=URLRequestMethod.POST;
			request.data=variables;
			var loader:URLLoader=new URLLoader();
			loader.dataFormat=URLLoaderDataFormat.VARIABLES;
			addListeners(loader);
			trace(variables);
			try 
			{
				loader.load(request);
			} 
			catch (error:Error) 
			{
				trace('Unable to load requested document.');
			}
		}
		
		private function addListeners(d:IEventDispatcher):void
		{
			d.addEventListener(Event.COMPLETE,onComplete);
		}
		
		private function onComplete(e:Event):void
		{
			var loader:URLLoader=URLLoader(e.target);
			var vars:URLVariables=new URLVariables(loader.data);
			if(vars.answer=="ok")
			{
				_fla.hideWorking();
			}
		}
	}
}

The PHP file:

<?php
    /*
 *************************************
  Flash CS3 Data Store Form                   
  http://www.flepstudio.org     
  Author: Filippo Lughi          
  version 1.0                                
 *************************************
 */
 /******** CHANGE YOUR DATABASE SETTING *******/
    $dbhost = 'localhost'; // database host ( usually localhost )
    $dbuser = 'root'; // database username
    $dbpass = 'root'; // database password
    $dbname = 'name'; // database name
    $mysql = mysql_connect($dbhost,$dbuser,$dbpass);
    mysql_select_db($dbname);
    
    /* VARIABLES FROM FLASH */
    $name=$_REQUEST["name"];
    $surname=$_REQUEST["surname"];
    $address=$_REQUEST["address"];
    $city=$_REQUEST["city"];
    $state=$_REQUEST["state"];
    $email=$_REQUEST["email"];
    
    /*INSERT INTO DB*/
    $Query = "INSERT INTO `".$dbname."`.`clients` (`ID`, `name`, `surname`, `address`, `city`, `state`, `email`) VALUES (NULL, \"".$name."\", \"".$surname."\",\"".$address."\",\"".$city."\",\"".$state."\",\"".$email."\");";
    
    /* ECHO TO FLASH */
    if(mysql_query($Query))
    {
        $answer='ok';
        echo "answer=".$answer;
    }
    else
    {
        $answer='nope';
        echo "answer=".$answer;
    }
?>

Next time we'll see how to retrieve the data.
EDIT: here is the second part: Retrieve data from mySQL with Flash CS3
Source files:

[Zombie]

I keep getting

1119: Access of possibly undefined property _Name through a reference with static type Class.

can you explain what that might mean?

[markerpen]

Sweet - very impressed

Been looking at a way to do this. be nice to upload images and their pathname ( which can be used in a dynamic xml file ) as well using something similar to this that will fit in :-
$file=$_FILES['userfile']['name'];
$uploaddir = '/your/folder/';
$basefile = basename($file);
$uploadfile = $uploaddir . basename($file);
move_uploaded_file($_FILES['userfile']['images']);

$sql="INSERT INTO table ('filename') VALUES ('$file')";
?>

Looking forward to see how the data is extracted....Been getting headaches trying to turn fields in the database fields into E4X xml element with attributes...

[koalapig]

how do i d/l the files?

[Onsitus]

how do i d/l the files?

See attached files at the end of the first post by Flep!

[yelibe]

I tried this tutorial and the application runs but it doesn't post data to my database. I ran the sql to create the table and configured the storeData.as and php files to point to my database but it just won't post. If I run the storeData.php file by itself it posts a blank record in the table.

Is there some code I need to apply to the interface?

Thanks,
Yelibe

[hope1]

Well im trying this on my server and the data is not beign stored in the table.

I modified de storeData.as to point my own storeData.php and still not working.

I've checked all the login info for the php file and i cant make it work.

Thanks for the tutorial its pretty good.

Hope u can help me.

[mvaldes]

very good tutorial but it seems that the connection between PHP and flash is not there, perhaps the HTML file is missing? or the HTML code (embedded tag) in the PHP file is missing?
thanks

[Flep]

very good tutorial but it seems that the connection between PHP and flash is not there, perhaps the HTML file is missing? or the HTML code (embedded tag) in the PHP file is missing?
thanks

Sorry I didn't get you.
If you send the forand go here:
Retrieve data from mySQL with Flash CS3
you'll see your data into the DataGrid.

[Innercynic]

I noticed a couple people having issues.

Are you guys accessing the php file via a web server capable of processing php code? You can't just reference the file path.

Personally I'm using a locally run WAMP server. Check it out.

Also ran into trouble with this line using Flash CS4:

loader.dataFormat=URLLoaderDataFormat.VARIABLES;

If you get the same error, try this alternative, worked for me!
loader.dataFormat = "VARIABLES";

Great tutorial Flep, thanks a lot!