I recently got into Flex, and wanted to find a good example of how to make Flex "talk" to php. After spending quite a bit of time bouncing around the web, I found an awesome test suite at Adobe's Flex Development area. Go ahead and download that file, and let's get started!
After downloading the file, extract it to a directory in your webroot. In order to run this example you will need apache, php5.2, and a mysql database. There are lots of good examples in that archive, from the very simple to the very complex, but let's start with the weborb one. First, head on over to weborbs home page and download the framework on it's own, and check out the index page of that install--it will really open your eyes to how powerful the package is, as well as what you can do in Flex. Also, for a great graphical reference of how to create new Flex projects using the weborb framework, check out the tutorial located on weborbs site, I used it myself, it's great!
First things first, Run the Flextest.sql file on your new or existing databse, located in the samples folder. Modify libraries/weborb/Services/MySQL.php with your database access information. If you want to take a look at the other examples or need help with this, follow the instructions on the index page of the new web folder you've created for the sdk.
If you've set up the db and configuration file correctly, you should be able to run the weborb example. From the index page of the ria_sdk, look for the samples link, and on the next page, under advanced samples, click the weborb link. Or, just run from your webroot/ria sdk folder/samples/flex/weborb. If this works ok you should see a nice datagrid and a set of data loaded into it. If you click on an item, it will pull it up into the update area. Try an update, and watch how the record you selected in the datagrid updates right away. Now try a delete and an add. Pretty straightforward right? But what's going on behind the scenes? Let's take a look! Here's what we're going to do now:
  1. We will turn the example from adobe's sample apps into a Flex project.
  2. We will then add a new class file to the weborb services package and query another database table with the methods, and update the relevant mxml calls inside the Flex project.
I will be using Flex 2 for this article, which is also available as a demo from Adobe. Go ahead and grab that if you don't have it, or you can also use the open source compiler, also available from Adobe, but I have not used it, so I will not be commenting on how to build Flex apps that way. First, you need to create a new project. Select Flex Data service from the type of projects, and check the box that says compile locally. Hit next.
For the root folder, select your test suite folder on the webroot. In the next field, give Flex the url root of where the app will reside through the browser. For contextroot, give it just the folder of your test suite with a forward slash (if you have the test suite in a subfolder, make sure and include that as well). Click Next. On the next screen, name your project weborb (this is important!), and click 'use default location'. Click next. Now pick a different folder for your output, a folder you have set up in your webroot. Also specify the url of that folder accesable via the browser. Click finish.
Now you will want to copy the entire directory contents of samples/weborb into your new project folder. Open up the weborb.mxml file in the editor. Hit Run and it should work as the example did earlier.
Once you get the new project set up correctly in Flex, let's take a look at how it's communicating with the weborb framework. Take a look at the mxml document and look on line 33. Looks incredibly simple, doesn't it? That's because it is! What you're seeing here is Flex running a method of the class located in the weborb/services/adobe_php_sdk/dbio_example.php class file! Let's take a further look at how Flex handles the request and updates the various elements on the page when the getUsers() method is run.
First of all, look up in the file at line 23. You'll see that the getUsers() method is running inside a function called initApplication. This function will run every time the app loads, thus it will always retrieve all the users from the table, so you can populate the datagrid with the resulting values. Let's investigate how the datagrid is told to read the resulting values that come back from the getUser method.
Look at line 24 of the mxml file. You'll see:

remoteObject.getUsers.addEventListener("result", getUsersResult); 
What this does is tie the getUsers Method to another function, which transforms the resulting object to a data array accessable to the Flex instance, and assigns the array to a variable called dataProvider:

private function getUsersResult(event:ResultEvent):void { 
dataProvider = ArrayUtil.toArray(event.result); 
} 
Now we have something the datagrid can use. Take a look inside line 103, where the datagrid is initialized. Note this parameter:

dataProvider="{dataProvider}" 
Now look how simple it is to read back values from your return array into the datagrid:

<mx:DataGridColumn headerText="User ID" dataField="userid" width="60"/> 
<mx:DataGridColumn headerText="User Name" dataField="username"/> 
<mx:DataGridColumn headerText="Email Address" dataField="emailaddress"/> 
Notice how all you specify is the field name in each dataField parameter? You'll see how easy it is to switch out your class file underneath the app and change the columns that are used to populate the table. We'll also change the update and delete methods so you can get an idea how those actions work as well.
Here is how the process works: when you select an item in the datagrid, it sends a record up to the edit form:

<mx:TextInput x="113" y="312" 
id="selectedusername" 
text="{dgUserRequest.selectedItem.username}"/> 

(note: the code above was only allowed to 
wrap for display in this article)
The datagrids id is dgUserRequest, so the selectedItem object native to Flex handles this event for you. Sweet! So all you do is give your form field the relevant field from the datagrid, and you're good to go.
Now that we have a good idea what's going on in the Flex, let's add a new class of our own to the weborb services folder. Create a a new folder next to the adobe demo folder (/libraries/weborb/services/adobe_php_sdk) and name it test. Copy the class file from the Adobe folder into the new folder. Name it whatever you want, but make sure to match the classname in the file to the name of the file, otherwise weborb will return an error on you.
For instance, if your classname is DbHandler, name the file DbHandler.php.
Now change line 23 in the mxml file to this:

remoteObject.source = "test.DbHandler"; 
Don't do anything to the new class file yet, (besides renaming the class name and the filename, and placing it in a new folder). Just re-build the project and make sure it works ok. Once you have that all in order, we want to pull data from another table, so let's run the northwind sql file from the weborb package (found under /services/weborb/test). Just add it as a table to the same database that your are using for the other example. This way we don't have to change any of the credentials for the database in the new class file, only the queries.
Now go ahead and modify the queries in the getUsers, UpdateUsers, and DeleteUser methods to be relevant to the new table you are querying. for the update users, since for this example we don't want to have to change the form, just pick two values you want to pull back to populate the form, and use those fields. I chose the company name and the contact name fields.
Now is where we get to see the true power of the Flex front end. I was amazed at how easy it was to convert this application to point to another table. Going from not having any idea how to do this, to figuring it out and then updating the relvant code literally took me 20 minutes. So imagine having a Flex app like this and needing to make it talk to a new table! Flex's re-usability is very high for implementation across many projects.
First off, you need to do nothing to the getUsers method! All you need to do is update your datagrid columns to match the titles you want, and the relevant column names from the database. It's really that easy. The update method is a little more involved however, but not much.
We will have to update the id references of the fields for the update user form first to match the column names of the database table, then update the new fieldnames as well in the updateUser() method. So, for instance, we want username to be company name, which is Company_Name in the northwind customers table. We change line 60 to this:

newUser.Company_Name=cname.text; 
notice how you don't need to name the form field the same as your db column name; the variable inside the updateUser method takes care of this.
Go ahead and update all the fields on the form to send back to the update method correctly, and re-build the project. If you did it correctly, when you call in a record and update the user, their info should update in the datagrid. If you are having trouble, you should notice that you get nice alerts in the flash file with your errors. Here's how it's working: notice that inside the php class we have a line like this:

throw new Exception($msg); 
This is written into weborb to produce a nice clean error message as an alert box right in Flex for you. Very nice!
I hope you've enjoyed this tutorial. It can be a little frustrating to get all this set up and working correctly, but trust me, it's worth it! Flex is an awesome framework for letting us coders into the flashy world withought having to be a great designer. You get all that high end polish of a Flex app with very little work, and as you can see, switching things out is very painless. So what are you waiting for? Go forth and Flex!