Tuesday, February 3, 2009

How to display any database table in a Flex 3 Datagrid

The project described in this post is made to display any table from a PostgreSQL or MySQL database in Adobe Flex 3.
(note: only text based database info will work, so it won’t work with e.g. pictures stored in a database)

Here’s an overview of the technologies used in this project:

database2flex.jpg


It works as follows:

1. The Flex 3 application sends out a HttpRequest to a php webpage.
2. The php script queries the database and selects all elements from a table
3. The same php script outputs the table as a XML-formatted page and returns this to the Flex application
4. The Flex application interprets the XML page and creates a table output using a Datagrid.

Download here all the source files. In order to make it work with your site do the following:

Make sure you have a webserver running PHP and MySQL or PostgreSQL

- Copy DataSmart.swf and DataSmart.html to your webdirectory
- Copy either GetDataSmart_MySQL.php or GetDataSmart_PostgreSQL.php to your webdirectory, depending on the database technology you’re using.
- Rename the .php to GetDataSmart.php
- Edit the .php page to connect to your database and to query the table you want to display.

open DataSmart.html in your webbrowser and everything should work (Adobe Flash plugin needed!)