You can read Install & Test AMFPHP 1.9 if you don't know how.
2. Download AS3FlexDB
You can download AS3FlexDB from here.
Copy from AS3FlexDBKit.zip\src\FlexDB\services\ the "database.php" file and paste it into a new directory "mysql" in amfphp service directory.
3. Prepare Adobe Flex
- Create a new Flex Project: "FlexDBTutorial".
- Copy as3flexdb_version.swc file from AS3FlexDBKit-version.zip\bin folder into your "libs" folder.
- Copy services-config.xml from AS3FlexDBKit-version.zip\src\FlexDBTests\src folder into your project folder.
If you done everything ok you project must look like this:
4. Setup services-config.xml
- Open services-config.xml
- Search for "http://localhost/amfphp/gateway.php" and replace this with your link to gateway.php file. If you have follow
the steps from Install & Test AMFPHP 1.9 this link should be fine and you don't have to change nothing.
- Right click on your Flex Project and in Flex Compiler paste -services "services-config.xml" and click ok.
And we are done with all the configuration we have to do, now let's code !
5. Add a datagrid and connect to MySQL
- First of all lets add a datagrid to our application and a button. This is the code
for our datagrid and our button:
- Code: Select all
<mx:VBox width="100%" height="90%">
<mx:DataGrid id="dataGrid" width="100%" height="100%" dataProvider="{users}" selectable="true">
<mx:columns>
<mx:DataGridColumn dataField="fname" headerText="First Name"/>
<mx:DataGridColumn dataField="lname" headerText="Last Name"/>
</mx:columns>
</mx:DataGrid>
<mx:Button label="Load from Database" click="onBtnClick()" />
</mx:VBox>
Now let's import the classes that we will use and create two variables that we will
use for manage database and query's:
- Code: Select all
/** Database */
import phi.interfaces.IQuery;
import phi.interfaces.IDatabase;
import phi.db.Database;
import phi.db.Query;
/** */
private var db :IDatabase;
private var query :IQuery;
This is the datagrid source:
- Code: Select all
[Bindable] public var users :ArrayCollection;
Now let's connect to MySQL :
- Code: Select all
/**
* This will be call when Application creation
* has complete.
*/
private function onCreateComplete():void
{
db = Database.getInstance();
query = new Query();
db.connect("conn1", "root", "", "localhost", "flexdb", true);
query.connect("conn1", db);
}
I have create a table "users" for test. So we will query our database and select all users in this table.
The table has this structure:
- Code: Select all
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 the code for select all users in this table is:
- Code: Select all
private function onBtnClick():void
{
query.addEventListener(Query.QUERY_END, queryEnd);
query.execute("SELECT * FROM users WHERE 1");
}
private function queryEnd(evt:Object):void
{
users = query.getRecords();
}
And we are done :) !
You can download the Flex project from below and if you have any questions post them here.
