Remote Objects

services-config.xml

Open your text editor and create a new file. Cut-n-paste the xml code below into your new file. Save the file as services-config.xml under your [PROJECT_HOME]/config/flex/ directory.

<?xml version="1.0" encoding="UTF-8"?>
<services-config>

   <services>
      <service-include file-path="remoting-config.xml" />
   </services>

   <channels>
      <channel-definition id="my-amfphp" class="mx.messaging.channels.AMFChannel">
         <endpoint uri="http://{server.name}:{server.port}/{context.root}/amfphp/gateway.php" class="flex.messaging.endpoints.AMFEndpoint"/>
      </channel-definition>
   </channels>

</services-config>

remoting-config.xml

Open your text editor and create a new file. Cut-n-paste the xml code below into your new file. Save the file as remoting-config.xml under your [PROJECT_HOME]/config/flex/ directory.

<?xml version="1.0" encoding="utf-8" ?>
<service id="amfphp-flashremoting-service" class="flex.messaging.services.RemotingService" messageTypes="flex.messaging.messages.RemotingMessage">

   <default-channels>
      <channel ref="my-amfphp"/>
   </default-channels>

   <destination id="empService">
      <properties>
         <source>*</source>
      </properties>
   </destination>

</service>

Flex

Our actionscript classes will be using the same package style naming as our php classes. Create the following directory structure under your [PROJECT_HOME]/src/flex/ directory.

• org
  • amfphp
    • tutorials

Employee.as

Open your text editor and create a new file. Cut-n-paste the actionscript code below into your new file. Save the file as Employee.as under your [PROJECT_HOME]/src/flex/org/amfphp/tutorials/ directory.

package org.amfphp.tutorials
{
   [RemoteClass(alias="org.amfphp.tutorials.Employee")]
   [Bindable]
   public class Employee
   {
      public var empId:int;
      public var firstName:String;
      public var lastName:String;
      public var phone:String;
      public var email:String;
      public var title:String;
   }
}

Main.mxml

Open your text editor and create a new file. Cut-n-paste the mxml code below into your new file. Save the file as Main.mxml under your [PROJECT_HOME]/src/flex directory.

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" backgroundColor="#FFFFFF">
   <mx:Script>
      <![CDATA[
         import mx.utils.ArrayUtil;
         import org.amfphp.tutorials.Employee;
         import mx.collections.ArrayCollection;
         import mx.rpc.events.ResultEvent;
         import mx.controls.Alert;
         import mx.rpc.events.FaultEvent;

         [Bindable]
         private var dp:ArrayCollection;

         [Bindable]
         private var emp:Employee = new Employee();
         private var index:Number;
         private var token:Object;

         private function faultHandler(fault:FaultEvent):void
         {
            Alert.show(fault.fault.faultString + "\n" + fault.fault.faultDetail, fault.fault.faultCode.toString());
         }

         private function resultHandler(event:ResultEvent):void
         {
            dp = new ArrayCollection( ArrayUtil.toArray(event.result) );
         }

         private function changeHandler(event:Event):void
         {
            emp = Employee(DataGrid(event.target).selectedItem);
         }

         private function saveHandler(event:ResultEvent):void
         {
            index = Number(event.token.index);
            if( index > -1 )
            {
               dp.setItemAt(event.result,index);
            }
            else
            {
               dp.addItem(event.result);
            }
         }

         private function removeHandler(event:ResultEvent):void
         {
            index = Number(event.token.index);
            if( index > -1 )
            {
               dp.removeItemAt(index);
            }
         }

         private function remove():void
         {
            token = empRO.remove.send(emp);
            token.index = dp.getItemIndex(emp);
            emp = new Employee();
         }

         private function cancel():void
         {
            emp = new Employee();
         }

         private function save():void
         {
            var newEmp:Employee = new Employee();
            newEmp.empId = emp.empId;
            newEmp.firstName = employee_first_name.text;
            newEmp.lastName = employee_last_name.text;
            newEmp.phone = employee_phone.text;
            newEmp.email = employee_email.text;
            newEmp.title = employee_title.text;
            token = empRO.save.send(newEmp);
            token.index = dp.getItemIndex(emp);
            emp = new Employee();
         }
      ]]>
   </mx:Script>

   <mx:RemoteObject id="empRO" destination="empService" source="org.amfphp.tutorials.EmployeeDao" fault="faultHandler(event)" showBusyCursor="true">
      <mx:method name="loadAll" result="resultHandler(event)"/>
      <mx:method name="save" result="saveHandler(event)"/>
      <mx:method name="remove" result="removeHandler(event)" />
   </mx:RemoteObject>

   <mx:DataGrid width="345" id="employee_list" dataProvider="{dp}" change="changeHandler(event)">
      <mx:columns>
         <mx:DataGridColumn headerText="Last name" dataField="lastName"/>
         <mx:DataGridColumn headerText="First name" dataField="firstName"/>
         <mx:DataGridColumn headerText="Telephone" dataField="phone"/>
         <mx:DataGridColumn headerText="Email" dataField="email"/>
         <mx:DataGridColumn headerText="Title" dataField="title"/>
      </mx:columns>
   </mx:DataGrid>

   <mx:Button label="Get Employee List" click="empRO.loadAll.send();"/>

   <mx:Form width="345" height="200">
      <mx:FormHeading label="Selected Employee" />
      <mx:FormItem label="First Name">
         <mx:TextInput id="employee_first_name" text="{emp.firstName}" />
      </mx:FormItem>
      <mx:FormItem label="Last Name">
         <mx:TextInput id="employee_last_name" text="{emp.lastName}"/>
      </mx:FormItem>
      <mx:FormItem label="Telephone">
         <mx:TextInput id="employee_phone" text="{emp.phone}" />
      </mx:FormItem>
      <mx:FormItem label="Email">
         <mx:TextInput id="employee_email" text="{emp.email}"/>
      </mx:FormItem>
      <mx:FormItem label="Title">
         <mx:TextInput id="employee_title" text="{emp.title}"/>
      </mx:FormItem>
   </mx:Form>

   <mx:HBox>
      <mx:Button id="btnSave" click="save();" label="Save" enabled="{dp != null}" />
      <mx:Button id="btnDelete" click="remove();" label="Delete" enabled="{employee_list.selectedIndex != -1}"/>
      <mx:Button id="btnCancel" click="cancel();" label="Cancel"/>
   </mx:HBox>

</mx:Application>