0 Replies Latest reply on Aug 26, 2007 2:23 PM by LinkMc

    Binding 2 DataGrids with 2 cfc functions

    LinkMc Level 1
      Hello, I am very new to flex and AS. So I thought I would start out learning it from Flex 3 and AS3. My background is mainly ColdFusion, MYSQL, and web technologies like HTML, CSS. So this was very ambitious for me. LOL

      I have been in this for about a month now and have bumped into a problem.

      I have 2 DataGrids each having its own cfc function being called. I need to to bind these dataGrids by the customerid in both tables, so when I select the customer datagrid it would show up their contacts in the other. Now this sounds simple, but when I have to use 2 cffunctions, now I am stooped. I have thought of adding another query that would combine them into a array collection and link them, which I don't know how to do. my thinking was to let the server do more of the work.

      the solutions I thought of are:
      1. create another function that would add these to an arraycollection -- I don't know how to do this. maybe a loop I suspect.
      2. use a for loop in flex to combind these arraycollections- this would be harder on the flex application.
      3. give up - not gonna do it, flex has me hooked.


      Here is what I have so far, I have both datagrids showing all the table information for each and not filtered. Some of this conent like application has been trimmed for an easier read.


      <mx:Application creationComplete="initApp()"">

      <mx:RemoteObject id="customer_RO" destination="ColdFusion" source="cms.cfc.customerConnection">
      <mx:method name="getCustomers" result="customerHandler(event)"/>
      <mx:method name="getContacts" result="contactHandler(event)"/>
      </mx:RemoteObject>

      <mx:Script>
      <![CDATA[
      /* Creates Bindable Array variable for the Customer List */
      [Bindable]
      private var CustomerList:ArrayCollection;
      [Bindable]
      private var ContactList:ArrayCollection;

      /* Creates an application initialization to load before application loaded */
      private function initApp():void
      {
      customer_RO.getCustomers();
      customer_RO.getContacts();
      }

      /* Created data handlers for the remoteObject method */

      private function customerHandler(event:ResultEvent):void
      {
      CustomerList = ArrayCollection(event.result);
      }

      private function contactHandler(event:ResultEvent):void
      {
      ContactList = ArrayCollection(event.result);

      }
      ]]>
      </mx:Script>


      <mx:DataGrid id="dg1" x="0" y="0" width="100%" height="100%" dataProvider="{CustomerList}">
      <mx:columns>
      <mx:DataGridColumn headerText="Name" dataField="companyname" width="250"/>
      <mx:DataGridColumn headerText="Address" dataField="street1"/>
      <mx:DataGridColumn headerText="City" dataField="city" width="100"/>
      <mx:DataGridColumn headerText="State" dataField="statecode" width="50"/>

      </mx:columns>
      </mx:DataGrid>
      <mx:DataGrid x="0" y="0" width="100%" height="100%" dataProvider="{ContactList}">
      <mx:columns>
      <mx:DataGridColumn headerText="Name" dataField="firstname" width="150"/>
      <mx:DataGridColumn headerText="Email" dataField="address" width="175"/>
      <mx:DataGridColumn headerText="Phone" dataField="phonenumber" width="175"/>
      </mx:columns>
      </mx:DataGrid>

      </mx:Application>

      Thanks for any help, Link

      P.S, if I am doing screwed up, correct me and forgive me.