1 Reply Latest reply on Sep 11, 2009 1:12 PM by lee704

    Populating datagrid based on passed argument

    lee704 Level 1

      As a follow-up question to my previous question regarding relating two datagrids, I have another issue.  When I run the code below, the Art datagrid is supposed to populate based on the itemSelected in the Artist datagrid.  Unfortunately, I get the error in the Flash Player "[RPC Fault faultString="Unable to invoke CFC - The ARTISTID argument passed to the getArt function is not of type numeric." ..."

       

      The error in the debug console is "warning: unable to bind to property 'artistid' on class 'Object' (class is not an IEventDispatcher)"

       

      The issue seems related to data typing but I cannot resolve.  Can you please take a look at the code below and offer any suggestions?

       

      Thanks!

       

      ********************** mxml ************************************

       

      <?xml version="1.0" encoding="utf-8"?>

      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
          creationComplete="initComponent()"
          height="100%"
          width="100%">

      <mx:Script>
        <![CDATA[
         import mx.collections.ArrayCollection;
         import mx.rpc.events.ResultEvent;
         import mx.controls.Alert;

         private var currentIndex:int=0;

         private function initComponent():void
         {
          refreshList(null);
         }

         public function refreshList(event:Event):void
         {
          this.roArt.getArtists();
         }

         private function getArtists_result(event:ResultEvent):void
         {
          this.dgArtistList.dataProvider=event.result as ArrayCollection;
          this.dgArtistList.selectedIndex=this.currentIndex;
         }

         private function getArt_result(event:ResultEvent):void
         {
          this.dgArtList.dataProvider=event.result as ArrayCollection;
          this.dgArtList.selectedIndex=this.currentIndex;
         }

         private function artistListChangeHandler(event:Event):void
         {
          /* var alert:Alert = Alert.show("Alert"); */
          this.roArt.getArt.send();
         }
        ]]>
      </mx:Script>

      <mx:RemoteObject id="roArt"
            showBusyCursor="true"
            destination="ColdFusion"
            source="cfartgallery.src.cfc.art">
        <mx:method name="getArtists"
             result="getArtists_result(event)">
        </mx:method>
        <mx:method name="getArt"
             result="getArt_result(event)">
         <mx:arguments>
          <artistid>{dgArtistList.selectedItem.artistid}</artistid>
         </mx:arguments>
        </mx:method>
      </mx:RemoteObject>


      <mx:Canvas width="100%"
            height="100%"
            x="0"
            y="0">

        <mx:DataGrid id="dgArtistList"
            x="0"
            y="29"
            change="artistListChangeHandler(event)">
         <mx:columns>
          <mx:DataGridColumn dataField="ARTISTID"
                 headerText="ARTISTID"
                 id="artistid"/>
          <mx:DataGridColumn dataField="FIRSTNAME"
                 headerText="FIRSTNAME"/>
          <mx:DataGridColumn dataField="LASTNAME"
                 headerText="LASTNAME"/>
         </mx:columns>
        </mx:DataGrid>

        <mx:DataGrid id="dgArtList"
            x="0"
            y="233">

         <mx:columns>
          <mx:DataGridColumn dataField="ARTID"
                 headerText="ARTID"/>
          <mx:DataGridColumn dataField="ARTISTID"
                 headerText="ARTISTID"/>
          <mx:DataGridColumn dataField="ARTNAME"
                 headerText="ARTNAME"/>
          <mx:DataGridColumn dataField="DESCRIPTION"
                 headerText="DESCRIPTION"/>
          <mx:DataGridColumn dataField="PRICE"
                 headerText="PRICE"/>
         </mx:columns>
        </mx:DataGrid>
        <mx:Label x="0" y="3" text="Artists"/>
        <mx:Label x="0" y="207" text="Art"/>
      </mx:Canvas>
      </mx:Application>

       

      ************************ cfc **************************************

      <cfcomponent>
      <cffunction name="getArtists" output="false" access="remote" returntype="query">
        <cfargument name="artistid" required="false">
        <cfset var qArtists="">
       
        <cfquery name="qArtists" datasource="cfartgallery">
         SELECT     artistid, firstname, lastname
         FROM       artists
         ORDER BY artistid ASC
        </cfquery>

        <cfreturn qArtists>
      </cffunction>

      <cffunction name="getArt" output="false" access="remote" returntype="query">
        <cfargument name="artistid" required="false" default="0" type="numeric">
        <cfset var qArt="">
       
        <cfquery name="qArt" datasource="cfartgallery">
         SELECT     artid, artistid, artname, description, price
         FROM       art
         WHERE   artistid = <cfqueryparam cfsqltype="cf_sql_integer" value="#arguments.artistid#">
         ORDER BY artid ASC
        </cfquery>

        <cfreturn qArt>
      </cffunction>
      </cfcomponent>

        • 1. Re: Populating datagrid based on passed argument
          lee704 Level 1

          I was able to figure it out.   Below is the code I used.  I hope this helps someone.

           

          ***************** mxml ******************************

           

          <?xml version="1.0" encoding="utf-8"?>
          <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
              creationComplete="initComponent()"
              height="100%"
              width="100%">

          <mx:Script>
            <![CDATA[
             import mx.collections.ArrayCollection;
             import mx.rpc.events.ResultEvent;
             import mx.controls.Alert;

             private var currentIndex:int=0;
             private var args:Object=new Object();

             private function initComponent():void
             {
              refreshList(null);
             }

             public function refreshList(event:Event):void
             {
              this.roArtist.getArtists();
             }

             private function getArtists_result(event:ResultEvent):void
             {
              this.dgArtistList.dataProvider=event.result as ArrayCollection;
              this.dgArtistList.selectedIndex=this.currentIndex;
             }

             private function getArt_result(event:ResultEvent):void
             {
              this.dgArtList.dataProvider=event.result as ArrayCollection;
              this.dgArtList.selectedIndex=this.currentIndex;
             }

             private function artistListChangeHandler(event:Event):void
             {
              args.artistid=dgArtistList.selectedItem.ARTISTID;
              this.roArt.getArt(args);
             }
            ]]>
          </mx:Script>

          <mx:RemoteObject id="roArtist"
                showBusyCursor="true"
                destination="ColdFusion"
                source="cfartgallery.src.cfc.artist">
            <mx:method name="getArtists"
                 result="getArtists_result(event)">
            </mx:method>
          </mx:RemoteObject>

          <mx:RemoteObject id="roArt"
                showBusyCursor="true"
                destination="ColdFusion"
                source="cfartgallery.src.cfc.art">
            <mx:method name="getArt"
                 result="getArt_result(event)">
            </mx:method>
          </mx:RemoteObject>


          <mx:Canvas width="100%"
                height="100%"
                x="0"
                y="0">

            <mx:Label x="0"
                y="10"
                text="Artists"/>

            <mx:DataGrid id="dgArtistList"
                x="0"
                y="30"
                change="artistListChangeHandler(event)">
             <mx:columns>
              <mx:DataGridColumn dataField="ARTISTID"
                     headerText="ArtistID"/>
              <mx:DataGridColumn dataField="FIRSTNAME"
                     headerText="First Name"/>
              <mx:DataGridColumn dataField="LASTNAME"
                     headerText="Last Name"/>
             </mx:columns>
            </mx:DataGrid>


            <mx:Label x="0"
                y="210"
                text="Art"/>

            <mx:DataGrid id="dgArtList"
                x="0"
                y="230">

             <mx:columns>
              <mx:DataGridColumn dataField="ARTID"
                     headerText="ArtID"/>
              <mx:DataGridColumn dataField="ARTISTID"
                     headerText="ArtistID"/>
              <mx:DataGridColumn dataField="ARTNAME"
                     headerText="Art Name"/>
              <mx:DataGridColumn dataField="DESCRIPTION"
                     headerText="Description"/>
              <mx:DataGridColumn dataField="PRICE"
                     headerText="Price"/>
             </mx:columns>
            </mx:DataGrid>


          </mx:Canvas>
          </mx:Application>

           

          *************************** art.cfc ***********************************

           

          <cfcomponent>

              <cffunction name="getArtByMedia" access="remote" returntype="query">
                  <cfset var result="">

                  <cfquery datasource="cfartgallery" name="result">
                  SELECT mediatype, artname, description, price
                  FROM media, art
                  WHERE media.mediaid=art.mediaid
                  ORDER BY mediatype, artname
                  </cfquery>

                  <cfreturn result>
              </cffunction>

              <cffunction name="getOrders" access="remote" returntype="query">
                  <cfset var result="">

                  <cfquery datasource="cfartgallery" name="result">
                  SELECT orders.orderid,
                          artname, orderitems.price,
                          customerlastname || ', ' || customerfirstname AS customer
                  FROM orders, orderitems, art
                  WHERE orders.orderid=orderitems.orderid
                      AND orderitems.artid=art.artid
                  ORDER BY customer, orders.orderid
                  </cfquery>

                  <cfreturn result>
              </cffunction>

          <cffunction name="getArt" output="false" access="remote" returntype="query">
            <cfargument name="artistid" required="false" default="0">
            <cfset var qArt="">
           
            <cfquery name="qArt" datasource="cfartgallery">
             SELECT     artid, artistid, artname, description, price
             FROM       art
             WHERE   artistid = #arguments.artistid#
             ORDER BY artid ASC
            </cfquery>

            <cfreturn qArt>
          </cffunction>


          </cfcomponent>

           

          ******************************* artist.cfc ***************************************

          <cfcomponent>

          <cffunction name="getArtists" output="false" access="remote" returntype="query">
            <cfargument name="artistid" required="false">
            <cfset var qArtists="">
           
            <cfquery name="qArtists" datasource="cfartgallery">
             SELECT     artistid, firstname, lastname
             FROM       artists
             ORDER BY artistid ASC
            </cfquery>

            <cfreturn qArtists>
          </cffunction>

          </cfcomponent>