Sending Flex Data to PHP using XML

When using Flex you often need to transfer data to a backend server, and one option to do this is to use XML; this tutorial is going to explain the basics of sending XML data to PHP. I am going to show how to build XML data using Flex's built in classes and then we will send the data over to PHP to be handled however you would like. The code for this tutorial is arranged slightly different than earlier tutorial, all the ActionScript code is in separate files that are included into the mxml. This technique is very similar to one used for ASP.Net pages (basically a code behind) - and helps to separate the logic code from the display.

Well what's a tutorial without a working example, so below we have the example application for the day. A simple contact manager which allows you look at the details on each contact and add new contacts. The add contact button at the bottom will pop up a new window to fill out the contact information. Once filled and the "Add Contact" button has been pressed on the pop up, the client XML information is built and send off to PHP. The PHP doesn't do much in this example except parse the XML and build an object from the data. At that point you can do what ever you would like with the data.

Creating main application ActionScript
Next we are going to start building the actionscript behind the main mxml file. The first thing we do is create a new actionscript file, mine is named "XMLAddressBookTutorialScript.as" because my main mxml file happens to be "XMLAddressBookTutorial.mxml". I follow the same pattern for all my files.

The first item to be added to the script file is a couple variables that we are going to use. The first is an XMLListCollection, which we use to hold all of our contacts and the second is a single XML item for the currently selected contact from our list. Another item we are going to build here is a initialization function for the application. This function sets a couple static parameters on the XML object (more on this in a second) - I also setup the initial names in the list here but that code is unimportant.

import flash.events.Event;

import mx.collections.XMLListCollection;
import mx.managers.PopUpManager;

[Bindable]
private var contacts:XMLListCollection;
[Bindable]
private var selectedContact:XML;

private var addContactPopUp:AddContactForm;

private function initApp():void
{
XML.ignoreWhitespace = true;
XML.prettyPrinting = false;
contacts = new XMLListCollection();
}
The two properties that I set on the XML class are above. The first, ignoreWhitespace, will ignore space characters at the beginning or end of any text nodes. The second is prettyPrinting which is much more important because it will make sure that when we use toXMLString() that the XML is simply printed without any added formatting (that would screw up parsing it in PHP). Now we need to add our script file to our mxml file and also hook up the initialization function.

We first add a tag to our application, directly under the opening application tag. Inside this tag we set a property named source equal to the path to our script file, which should be in the same directory. Also done at this time is the hooking into the creation complete event of the main application tag. Both snippets can be found below.