Link to home
Start Free TrialLog in
Avatar of tomhwtt
tomhwtt

asked on

Defining/Using Coldfusion Struct in Flex

I am trying to figure out how to define and use a coldfusion struct in flex.  I have figured out how to create a value object class in flex.  I created an action script class (Customer.as)  I am using just three variables in my class (recordID, firstName, lastName).

I learned how to populate an ArrayCollection using static data and this class and populated a datagrid. Good Stuff

I am trying to figure out how to populate this ArrayCollection from a struct returned from Coldfusion.

I would also like to return the struct to an Object in flex so I can populate a form with the same fields.  Record ID, First Name, Last Name.

I have been pointed in the right direction thus far (thanks, zadoc)  and I am hoping I can wrap my head around this soon.

Below is my CFC and Flex code.  The first half of my CFC inserts a record and returns a record id.  The second query gets the record and creates a struct...and returns it.

Thank You!
<!--- Coldfusion CFC--->
 
<cfcomponent output="false">
    
    <!---Insert New Customer--->
<cftransaction>
     <cffunction name="insertCustomer" access="remote" returntype="struct">
		<cfargument name="firstName" type="string" required="true"/>
        		<cfargument name="lastName" type="string" required="true"/>
 
		<cfquery name="insertCustomer" datasource="mydatasource" >
			insert		
			into		customers
						(firstName, lastName)
			values		(<cfqueryparam cfsqltype="cf_sql_varchar" value="#firstName#"/>,
            					<cfqueryparam cfsqltype="cf_sql_varchar" value="#lastName#"/>)
                        
                        SELECT Scope_Identity () as quoteID         
		</cfquery>     
        
    <cfset quoteID = #insertCustomer.quoteID#>
    
    <cfquery name="getCustomer" datasource="mydatasource">
    SELECT recordID, firstName, lastName
    FROM customers
    WHERE recordID = #quoteID#
    </cfquery>
    
    <cfset objCustomer = {
	recordID = "#getcustomer.recordID#",
	firstName = "#getcustomer.firstName#",
	lastName = "#getCustomer.lastName#"
	} />
    
    <cfreturn insertCustomer/>
    </cffunction>
</cftransaction>
</cfcomponent>
 
<!---Flex Code --->
 
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" initialize="init()">
 
	<mx:RemoteObject id="conn" destination="ColdFusion" source="simpleform" showBusyCursor="true">
		<mx:method name="insertCustomer"/>
	</mx:RemoteObject>
 
 
<mx:Script>
	<![CDATA[
		 import valueObjects.Customer;
       		 import mx.rpc.events.ResultEvent;
       		 import mx.collections.ArrayCollection;
        
        [Bindable]
        private var customerInfoData:ArrayCollection;
        
        	private function init():void{
           		populateCustomerInfoData();
           }
           
           
            private function clickHandler():void {			
				conn.insertCustomer(inputFirstName.text,inputLastName.text);
				inputFirstName.text = "";
				inputLastName.text = "";
				
			} 
            
             private function populateCustomerInfoData():void{
             customerInfoData = new ArrayCollection
             
            var customerInfo:Customer = new Customer();
					customerInfo.recordID = 27;
					customerInfo.firstName = "Tom";
					customerInfo.lastName = "Jones";
					
			var customerInfo2:Customer = new Customer();
					customerInfo2.recordID = 32;
					customerInfo2.firstName = "Anne";
					customerInfo2.lastName = "Johnson";
					
					customerInfoData.addItem(customerInfo);
					customerInfoData.addItem(customerInfo2);
             
             }
 
	]]>
</mx:Script>
 
		<mx:VBox>
 
					<mx:Form id="inputForm">
							<mx:FormItem label="First Name">
							<mx:TextInput id="inputFirstName"/>
							</mx:FormItem>
							<mx:FormItem label="Last Name">
							<mx:TextInput id="inputLastName"/>
							</mx:FormItem>
						</mx:Form>
						
			<mx:Button label="Save" click="clickHandler()"/>
		
						<mx:Form id="resultsForm">
							<mx:FormItem label="First Name">
							<mx:Text id="resultsFirstName"/>
							</mx:FormItem>
							<mx:FormItem label="Last Name">
							<mx:Text id="resultsLastName" />
							</mx:FormItem>
							<mx:FormItem label="Record ID">
							<mx:Text id="resultsRecordID"/>
							</mx:FormItem>
						</mx:Form>
						
	<mx:DataGrid id="orderGrid" width="500" height="75" dataProvider="{customerInfoData}" y="56" x="262" >
		<mx:columns>
			<mx:DataGridColumn headerText="ID" width="10" dataField="recordID" />
			<mx:DataGridColumn headerText="First Name" width="35" dataField="firstName" />
			<mx:DataGridColumn headerText="Last Name" width="35" dataField="lastName" />
		</mx:columns>
	</mx:DataGrid>
						
		
		</mx:VBox>
	
</mx:Application>

Open in new window

Avatar of Andrew Maurer
Andrew Maurer
Flag of United States of America image

Yikes! what happened to your result and fault handler methods? Right now, you are making a call to the CF service but you dont handle the result of the data.

put your result handler functions back in, then set a break-point within it. If you browse the data in the debugger, you'll be able to see how to access it.

Also.. for being new at this stuff.. ArrayCollection is like a CFQuery object.

Here is the code you posted in another thread.
        <mx:RemoteObject id="conn" destination="ColdFusion" source="simpleform" showBusyCursor="true">
                <mx:method name="insertCustomer" result="insertHandler()" fault="mx.controls.Alert.show(event.fault.faultString)"/>
        </mx:RemoteObject>
 
<mx:Script>
        <![CDATA[
            import mx.rpc.events.ResultEvent;
        
                        private function insertHandler():void {
                                inputFirstName.text="";
                                inputLastName.text="";
                                
                                }
                        
                        private function clickHandler():void {                  
                                conn.insertCustomer(inputFirstName.text,inputLastName.text);
                                
                        } 
        ]]>
</mx:Script>

Open in new window

Now add a param to the insertHandler
 private function insertHandler(event:ResultEvent):void {
                                inputFirstName.text="";
                                inputLastName.text="";
                                
                                }

Open in new window

Avatar of tomhwtt
tomhwtt

ASKER

thanks for the help, zadoc... I am going to get back at this tomorrow.

My brain is officially fried!  :)
Avatar of tomhwtt

ASKER

zadoc,

I changed things up a little because...to be honest I am completely lost.  I studied structs quite heavily this weekend and I think I understand.

Where I am having the problem is the flex code.  I found a good tutorial that showed me how to return a variable from a cfc and when I click a button...it appears in the text box.  Good Stuff.

I broke everything down to the basics to try and understand this.

I am including my cfc with a function that returns a struct.  I then have a flex page where I click the button, it calls the cfc and I want to have the first name and last name fill in the perspective textInput blocks.

I tried the debugging perspective and I cannot see a thing.  I am sure i will learn more as I go.

Can you help me complete the flex code needed to make this work?  I have searched every blog and tutorial on the internet and cannot find it (or don't understand what i am reading :)

Thanks

Tom
<!--- CFC --->
 
<cfcomponent name="Customer">
  <cffunction name="getCustomer" access="remote" returnType="struct">
  
  <cfset objCustomer = {
	firstName = "Tom",
	lastName = "Jones"
	} />  
    <cfreturn objCustomer/>
  </cffunction>
</cfcomponent>
 
<!--- Flex --->
 
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
  <mx:RemoteObject id="returnstruct" destination="ColdFusion" source="returnstruct" result="remotingCFCHandler(event)"/>
 
  <mx:Script>
  <![CDATA[
    import mx.rpc.events.ResultEvent;
    
    private function remotingCFCHandler(e:ResultEvent):void
    {
      firstName.text = I AM LOST :);
      lastName.text = I AM LOST :);
    }
 
    private function callRemotingCFC():void
    {
      returnstruct.getCustomer();
    }
    ]]>
  </mx:Script>
  <mx:VBox>
    <mx:TextInput id="firstName" />
    <mx:TextInput id="lastName" />
    <mx:Button label="Show" click="callRemotingCFC()"/>
  </mx:VBox>
</mx:Application>

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of Andrew Maurer
Andrew Maurer
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of tomhwtt

ASKER

Zadoc,

Do I set the breakpoint on the curly brace?  Do I look at the Variables screen in the degug perspective?

Thanks
private function remotingCFCHandler(e:ResultEvent):void
    {
      firstName.text = e.result.FIRSTNAME;
      lastName.text = e.result.LASTNAME;
DOUBLE CLICK HERE
    }


AND YES    =)
private function remotingCFCHandler(e:ResultEvent):void
    {
OR HERE
      firstName.text = e.result.FIRSTNAME;
      lastName.text = e.result.LASTNAME;
    }
expand e
then expand result

you should see your vars FIRSTNAME and LASTNAME  in the list
Avatar of tomhwtt

ASKER

SWEEEET!  There it is...clear as day :)

It is starting to make sense.

Thank you so much for all the help this weekend..

Tom
YW =)

I've learned a lot just by browsing the variables in debug perspective.
Avatar of tomhwtt

ASKER

Yeah... that is very cool.  Now that I know what I am looking for... it sure will help a lot.

before this weekend I did not even know there was a debugging perspective :)

Thanks again...