Menu:

Sponsor

Discover Master of Alchemy, our first iPad/iPhone and iPod touch game!

Follow Me

 

Forum's topics

Latest Files

Archives

Top Rated

Categories

Photo Gallery


Connect to MySQL in Adobe Flex using AS3FlexDB

Introduction

AS3FlexDB project is a open source library that allows Adobe Flex applications to connect to a MySQL server. This library use AMFPHP to access a MySQL server.
AS3FlexDB let you write all your SQL's in FLEX and not in PHP. More exactly you can do almost every action on a table in FLEX without making new classes in PHP and access it.
From version 1.4.0 AS3FlexDB can bind a table with a Flex Component just from MXML.

1. Download AS3FlexDB

You can download AS3FlexDB from here.

2. Setup AMFPHP

First download and install AMFPHP. You can find a lot of tutorials on how to do that on in my tutorial section or by searching on Google. After you have installed AMFPHP copy "AS3FlexDBKit\src\FlexDB\services\database.php" file from AS3FlexDB archive in your amfphp services folder. (ex: amfphp\services\mysql\database.php)

3. Prepare Adobe Flex Builder

  1. Create a new Flex Project: "FlexDBExample".
  2. Copy†as3flexdb_version.swc file from "AS3FlexDB-version.zip\bin" folder into your "libs" folder.
  3. Copy†services-config.xml†from FlexDB-version.zip\src\FlexDBTest\ folder into your project folder.

If you done everything ok you should have:
  • bin-debug [folder]
  • libs
    • as3flexdb_1.3.0.swc
  • FlexDBExample.mxml
  • services-config.xml

4. Setup service-config.xml

Open services-config.xml
Search for "http://localhost/amfphp/gateway.php" and replace this with your link to gateway.php file
Right click on your Flex Project and in Flex Compiler textinput paste†-services "services-config.xml"†and click ok

5. Add a datagrid and connect to MySQL

First of all letís add a datagrid to our application.This is the code:

<mx:DataGrid id="dg1" width="100%" height="100%" dataProvider="{q1.Records}">
<mx:columns>
		<mx:DataGridColumn dataField="fname" headerText="First Name"/>
		<mx:DataGridColumn dataField="lname" headerText="Last Name"/>
		<mx:DataGridColumn dataField="password" headerText="Password"/>
	</mx:columns>
</mx:DataGrid>
					
Now you must define phi namespace (xmlns:phi="phi.db.*") for you to use AS3FlexDB classes in your MXML. This is the code:
<mx:Application layout="vertical" xmlns:phi="phi.db.*" xmlns:mx="http://www.adobe.com/2006/mxml">
				
Now all you have to do, is to make a Database object set user, pass, db, and host correctly and bind a Flex Component (ex: ComboBox, DataGrid) with a Query object.
<phi:ConnectionData id="c1" name="mxml_conn1" host="localhost" db="test" username="root" password="root" />
<phi:Database id="db1" connection="{c1}" /> // This is the connection with database

// This is the query object. You can use the id to bind a Flex
// component with an SQL.
<phi:Query id="q1" database="{db1}" q="SELECT * FROM users WHERE 1" />
<phi:QueryExecute id="q1ex" query="{q1}" />
				

I have create a table "users" for test. So this example will query our database and select all users in this table.
The table has this structure:

CREATE TABLE `users` (
`id` INT( 5 ) NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`fname` VARCHAR( 255 ) NOT NULL ,
`lname` VARCHAR( 255 ) NOT NULL
) ENGINE = innodb;
				

And this is all!
Have fun and for any question contact me at ghalex at gmail (dot ) com.

6. Download

Download files used for this tutorial here