Example — Employee listing from ‘employee’ table
First Create a PHP file, which connects to the data base, query the table, retrieve the value and store it in a XML file.
list.php
<?php
header('Content-Type: text/xml');
?>
<employeedetails>
<?php
require_once("DB.php");
$dsn = 'mysql://root@localhost/test';
$db =& DB::Connect( $dsn, array() );
if (PEAR::isError($db)) { die($db->getMessage()); }
$res = $db->query( "SELECT firstname, lastname, designation, department FROM employees" );
while( $res->fetchInto( $row ) )
{
?>
<employee>
<first><?php echo( $row[0] ); ?></first>
<last><?php echo( $row[1] ); ?></last>
<designation><?php echo( $row[2] ); ?></designation>
<department><?php echo( $row[3] ); ?></department>
</employee>
<?php
}
?>
</employeedetails>
Now we need to wrap a Flex user interface around the XML list.php page. Create a data viewer for XML data that comes from PHP with Flex.
list.mxml file, used for this is copied below.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:XML id="mydata" source="http://localhost/flex_php/list.php"></mx:XML>
<mx:DataGrid id="employeelist" x="10" y="10" dataProvider="{mydata..employee}">
<mx:columns>
<mx:DataGridColumn dataField="first" />
<mx:DataGridColumn dataField="last" />
<mx:DataGridColumn dataField="designation" />
<mx:DataGridColumn dataField="department" />
</mx:columns>
</mx:DataGrid>
</mx:Application>
The <mx:XML> tag defines the location of XML data source. Its our list.php file.
<mx:DataGrid> tag is a Flex control that displays data in a tabular format.
To tell the DataGrid control which fields to display, create an <mx:columns> tag that contains <mx:DataGridColumn> tags for each field.
Example — Insert data into ‘employee’ table
First Create a PHP file, which connects to the data base, prepares the INSERT statement, and runs it with the variables provided by the POST arguments that will come from the Flex application. Flex applications use POST data just like any other web client, which makes it easy to connect with existing web applications.
addEmployee.php
<?php
header('Content-Type: text/xml');
require_once("DB.php");
$dsn = 'mysql://root@localhost/test';
$db =& DB::Connect( $dsn, array() );
if (PEAR::isError($db)) { die($db->getMessage()); }
$sth = $db->prepare(
"INSERT INTO employees ( firstname, lastname, designation, department ) VALUES ( ?, ?, ?, ? )"
);
$db->execute( $sth,
array( $_POST['firstname'], $_POST['lastname'], $_POST['designation'], $_POST['department'] )
);
?>
The next step is to build the frontend form that will add employee to table. This form uses the addEmployee.php script on the server to add new entries to the database. The MXML script for the form is shown below.
addEmployee.mxml
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:HTTPService id="srv" url="http://localhost/flex_php/addEmployee.php" method="POST">
<mx:request>
<firstname>{firstname.text}</firstname>
<lastname>{lastname.text}</lastname>
<designation>{designation.text}</designation>
<department>{department.text}</department>
</mx:request>
</mx:HTTPService>
<mx:Form>
<mx:FormItem label="First Name">
<mx:TextInput id="firstname"/>
</mx:FormItem>
<mx:FormItem label="Last Name">
<mx:TextInput id="lastname"/>
</mx:FormItem>
<mx:FormItem label="Designation">
<mx:TextInput id="designation"/>
</mx:FormItem>
<mx:FormItem label="Department">
<mx:TextInput id="department"/>
</mx:FormItem>
<mx:FormItem>
<mx:Button label="Add Employee" click="srv.send()"/>
</mx:FormItem>
</mx:Form>
</mx:Application>
At the top of the file is the definition of the HTTP service that the PHP addEmployee.php script provides.
At the bottom is the form, with all the labels, text input areas and “Add Employee” button.
