Integrating Flex & PHP - An Introductory Tutorial

Ten years ago or so, the World Wide Web primarily meant static HTML. Horrendous JavaScript, trivial games, and frivolous splash pages represented the common attempts at browser-based pizzazz. But in the past couple of years, a decade’s worth of server-side dominance has ironically revitalized interest in the client. Today, the best sites are using Rich Internet Applications (RIAs), tied into the server, to provide the user with an experience closer to a desktop application. RIAs are most commonly built using either JavaScript or Flash in the browser, communicating with some technology on the server. In this article I discuss how to use Flash in the browser, created using Flex (Flash content can be created using other software as well), to interact with PHP on the server.

Flex is an open-source framework (open-source as of version 3.0) managed by Adobe. The framework makes it very easy to use common elements and functionality, which can then be tied together via ActionScript, a language quite similar to JavaScript. A completed Flex project is compiled as a SWF file (pronounced “swiff”) that can run in any Web browser that has installed the Flash plugin. You can develop Flex projects using a text editor and the free Software Development Kit (SDK) or you can save yourself oodles of time by using Adobe’s commercial (but Eclipse-based) Flex Builder IDE (you can download a free trial of it here).

For the specific example, I’ll develop part of a Web-based application for managing employees. The application has two primary features:

1. The ability to add new employees.
2. A display of all the employees in a table (or a DataGrid, in Flex parlance).

I’ve chosen to focus on these particular aspects of an online application because they represent the most common client-server interactions: posting data to the server and getting data from the server. In the end, I’ll be generating these files:

•    An HTML page that contains the Flash.
•    The SWF file itself.
•    One PHP script that receives form data and returns a text response (for adding new employees).
•    One PHP script that just returns XML (for showing all current employees).
•    One PHP script that just returns XML (for listing the departments).

You can download the source code and resulting files here.


Since the Flex side of things will require the three PHP scripts (and the backend database) in order to function, I’ll work through that list backwards.  

Creating the Database
For this project, I’m going with a fairly routine employees/departments model, practical yet easily understood. My design has two tables: employees and departments. There’s a many-to-one relationship between them, in that each employee can only be in one department but each department can have multiple employees. For the sake of simplicity, I’m not concerning myself with department heads and company hierarchy or even all the details that might be associated with an employee or department. After you read this article, it shouldn’t be hard for you to go back in and change the particulars per your needs.

The SQL commands for creating the tables are:

CREATE TABLE `departments` (
`department_id` TINYINT UNSIGNED NOT NULL AUTO_INCREMENT PRIMARY KEY,
`department` VARCHAR(40) NOT NULL,
UNIQUE (`department`)
)
CREATE TABLE `employees` (
`employee_id` INT UNSIGNED NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`department_id` TINYINT UNSIGNED NOT NULL,
`first_name` VARCHAR(20) NOT NULL,
`last_name` VARCHAR(30) NOT NULL,
INDEX (`department_id`),
INDEX `name` (`last_name`, `first_name`)
)

To populate the departments table, run these INSERTs (add more departments, if you’d like):
INSERT INTO `departments` (`name`) VALUES ('Human Resources')
INSERT INTO `departments` (`name`) VALUES ('Accounting')
INSERT INTO `departments` (`name`) VALUES ('Marketing')

I’ll be using MySQL as the database application, but if you’re using another one, those same SQL92-compliant commands should work.