12 Replies Latest reply on May 20, 2009 8:24 PM by ProjectedSurplus

    How to use Flex Builders Auto Generated CFCs

    codeidiot


      OK. Not only have I already gone to a 4 day flex training, have an advanced coldfusion certification and work with 3 coworkers who have done the same...none of us can figure out how in the heck the flex builder's autogenerated cfc's are to be used. No big deal on the fact that this might be something we simply are encountering for the first time, but the complete and utter absence of a single piece of example code or documentation stating how to use this code correctly is very very very very irritating.

      Can anybody, share with me anything about how these CFCs are to be used correctly. For example. We are using the wizard to generate an "Active Record CFC" set of cfc's for an example table contain four fields. We have a data grid that is now populated by the "getAllAsQuery" function....we would like to implement the feature of making this dataGrid updateable. We know how to pass data back and forth and yes we could write our own CFC to do this...but having it autogenerated is a really neat option...but the question remains....how does one use them!!!

      Any help would be much appreciated. Thanks in advance!

        • 1. Re: How to use Flex Builders Auto Generated CFCs
          mnimer
          Let's see where to start. First the CFC wizards are just there to save you the hassle of writting a couple of hundred lines of code youself. ActiveRecord and Bean/Dao are common patterns among the differen CF frameworks. Also, technically they have nothing to do with flex. you could use the same cfcs for a simple .cfml application too. or you could write completely different CFCs to use from flex.

          I think I know where you are getting tripped up. The CFCs are designed to work as "Objects", in a OOP type of way. so 1 row in a db table would map to 1 instance of a CFC. For instance each user would have it's own user CFC. Since you are calling the getAllAsQuery() method you aren't returning objects, just a few columns of data. Because of that, you can't send a row back to the save() method. Since the save() method expects as a cfargument an Object or CFC Instance.

          Instead you want to call getAll() and return an array of CFC Instances. Then you can edit one of these objects in flash and when you send it back to the save() method it will be a CFC instance "object" and everything will work.

          For an example, run through the ColdFusion Application Wizard, from the new project option in flexbuilder, iAnd build a new application. It will build a full application complete with flex and CF code (using the bean/dao type of cfcs). Then did through the code to see a running application use these CFC's from flex.
          • 2. Re: How to use Flex Builders Auto Generated CFCs
            codeidiot Level 1
            mnimer, thanks for your response.

            Where is this ColdFusion Application Wizard? Are you refering to the "Coldfusion Wizard" that created the cfcs in question? Or, are you speaking of another feature of flex builder? One that I am unable to locate on any sample files, start pages, menu items nor present in the help files.

            I guess what I am looking for is example code. I am fully aware of the methodologies with the structures of these cfc's and it is quite true that I am getting tripped up on them....The fact is that I am already aware that I am supposed to be sending back an object to the save() function....but nothing I try works!

            Here is my code:

            Index.mxml
            ------------------------------------------------------------------------------------------ --------------------------------
            ------------------------------------------------------------------------------------------ --------------------------------
            <?xml version="1.0" encoding="utf-8"?>
            <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" layout="absolute">

            <mx:Script source="GridData.as" />

            <mx:RemoteObject
            id="GetGridData"
            destination="ColdFusion"
            source="UsingFlex.CFC.GridTestGateway"
            result="handleQueryResult(event)"
            fault="Alert.show(event.fault.message)"/>

            <mx:Button label="Pop Grid" click="GetGridData.getAllAsQuery()" x="135" y="123"/>
            <mx:DataGrid id="TheGrid" change="GetGridData.save(TheGrid)" editable="true" dataProvider="{qResult}" x="135" y="153">
            <mx:columns>
            <mx:Array>
            <mx:DataGridColumn editable="false" dataField="ID"/>
            <mx:DataGridColumn editable="true" dataField="ColumnOne"/>
            <mx:DataGridColumn editable="true" dataField="ColumnTwo"/>
            <mx:DataGridColumn editable="true" dataField="ColumnThree"/>
            <mx:DataGridColumn editable="true" dataField="ColumnFour"/>
            </mx:Array>
            </mx:columns>
            </mx:DataGrid>

            </mx:Application>

            GridData.as
            ------------------------------------------------------------------------------------------ --------------------------------
            ------------------------------------------------------------------------------------------ --------------------------------
            // ActionScript file
            import mx.rpc.events.ResultEvent;
            import mx.controls.Alert;
            import mx.collections.ArrayCollection;

            [Bindable]
            public var qResult:ArrayCollection;

            [Bindable]
            public var aReturnTypes: Array = [{label:"query", data:"query"}];

            [Bindable]
            public var returnType:String="string";

            public function clearAll():void{
            qResult=new ArrayCollection();
            }

            public function handleQueryResult(myevent:ResultEvent):void{
            qResult=myevent.result as ArrayCollection;
            }
            • 3. Re: How to use Flex Builders Auto Generated CFCs
              ANSCORP
              I've poured over a couple of different applications autogenerated by the CF extensions for Flex builder and, speaking from experience, if you're not familiar with the methodologies, it's almost like trying to interpret a foreign language. However, after a few hours of dissecting code line by line, it's starting to become a little more clear to me. One thing I would suggest is that you download the ToDoList sample Flex application from the ASFUSION site ( http://www.asfusion.com). It is a very simple Flex front-end to a single table database. Their CFCs are similar to those generated by the wizzard, but they appear to have modified them so that they are more understandable. Also, they will be publishing a step-by-step article in the CF Developers Journal about all the pieces of this application. Hopefully, they'll be explaining how the CFCs function relative to the FLEX application.

              M. McConnell
              • 4. Re: How to use Flex Builders Auto Generated CFCs
                mnimer Level 1
                The wizard can be found here

                File -> New -> Other -> ColdFusion Wizards -> ColdFusion/Flex Application Wizard.


                Also check out my blog post here
                http://www.mikenimer.com/index.cfm/2006/7/5/CF-and-Flex-presenation

                It has a recorded breeze and 2 simple sample applications that should be easy to understand.

                hth,
                ---nimer
                • 5. How to use Flex Builders Auto Generated CFCs
                  codeidiot Level 1
                  Thanks mnimer, I appreciate you taking the time to answer my frustrations, your replies were very informative..and were very helpful....

                  I am really encouraged by Flex and believe it has the potential to be a really awesome tool....but if there were more simple "real world" examples it would be much easier to learn...especially if there were some visual components that could demonstrate the relationships between all the .as, .cfc, .mxml files. I had no idea how much I would need to "lift" just to "flex"!

                  Seriously, this is quite a steep learning curve....one that I have'nt encountered yet and I'm feeling a little stupid with the fact that I am a very proficient CF developer, have taken a Flex course and still can't do the most simple task, like send the data of my DataGrid to a CFC for updating....I can't even think how to do that cleanly....at least beyond the 5,000 ways I tried it. I ended up creating an array object that got updated each time a row was updated then when all was completed, I sent the array to the cfc for processing. It works but I can't imagine that there isn't a much simpler way. On top of this, I wanted to put a drop down box in my Grid. I have to write a custom component? Whoa!...and here I am again spending days and days on simple steps. Those are what I call real world examples and ones I don't have 5 hours during my day to go and search for...after all I still have to produce work all the while trying to learn something new. Do you feel sorry for me yet? Just Kidding.

                  Though I am all behind it, I will be very surprised to see Flex flourish in the enterprise in it's current state. Do you know of any "Good" materials that really get into the guts of flex. For example a psuedo "Anatomy of Flex". I swear I have downloaded every whitepaper available....is there anything that isn't a novel that also contains "real world" examples accompanied by pretty pictures for apparently stupid people who have more of a visual thinking pattern???

                  Again Thanks.
                  • 6. Re: How to use Flex Builders Auto Generated CFCs
                    ProjectedSurplus

                    Well, three years on .... and lets just say I must be equally or more stupid than you because surely there must have been some movement somewhere in tutorials, presentations, flexbuilder updates  . . . . one would think.

                     

                    For reference, I tried picking up Flex2 as essentially my first programming foray.  Yeah right.  Oh, I can drag and drop pretty components no problem but connecting to a dbase (excluding localhost which of course is the ONLY dbase any tutorial ever mentions)?????

                     

                    MONTHS of reading and trials for nothing.

                     

                    So I stepped back to learn CFusion8 -- cuz that must be my problem right?   Turns out not to be but its amazing how much better the docs, guidance, help is for CF.

                     

                    But now I'm back to Flex (3!!!!!) and despite months more of research, still don't seem to make much headway.  Small victory in that I've been able to get RemoteObjects connecting to cfcs and returning arrays of data.

                     

                    Best I can figure is that an AS3  value object needs be created to store/handle the returned data so why is explaining how/what so hard?????

                     

                    Right-click RDS >>> CF Wizards >>> Create CFC   ---- now which CFC Type (I know there are pluses and minuses but I'm trying to use all Adobe products here so . . . . )

                     

                    And after it creates the 4 files I seem to have to (with other cfcs at least) copy them over to my CF8/wwwroot (flexBuilder only seems to "post" them into the ProjectName-debug folder which then I don't seem able to access)  -- OK so which cfc&method needs called????   I've tried unsucessfully calling the Gateway.cfc the DAO.cfc . . . . . .

                     

                    PLEASE PLEASE PLEASE can't someone describe how to use the bean/classes/etc step by step (by the way, if I go to another google result page demonstrating how to use the Master-Detail wizard I think I will puke.  As above, I am verrrrrry stupid but how can I use that code in a real app????).

                    • 7. Re: How to use Flex Builders Auto Generated CFCs
                      Michael Borbor Level 4

                      Hi there, what's your name by the way?

                       

                      What is a VO or DTO, and why would you use it?


                      This was copy from the Java world, so it's a very OOP principle, basically in the OOP world everything is a class that has methods and properties, and you represent everything with classes, a VO is just that a class that represents an entity in your app. You use it for a few reasons in my opinion:

                       

                      1. It allows you to pass strongly typed data between different layers in your app.
                      2. It's more verbose, it's a good OOP practice, and also makes debugging and reading you code easier.
                      3. It allows easy data type conversion between CF and Flex.

                       

                      You obviously know how to use the wizards, after you select your table and open the wizard you'll see three different CFC types, if you're using LCDS then select that type if you don't I'll recommend you to go with BEAN/DAO. In Flex Builder you can create a folder link to a system folder, so if you create a folder named MyCFCs and you set this virtual folder to be hold inside c:\ColdFusion8\wwwroot every file that you put in this folder will be place in c:\ColdFusion8\wwwroot so you don't have to manually copy those files.

                       

                      In this wizard you'll see CFC folder in there you can select your virtual folder, you'll see below the CFC package name this is extremely important to be set right, what is the CFC package name? Basically it's the same folder structure where your CFCs will be located for instance let's say you're gonna place the files in this folder structure c:\ColdFusion8\wwwroot\com\myPersonalDomain\ so your CFC package name will be com.myPersonalDomain.

                       

                      You'll probably also would like to enable the option: Create an ActionScript value object in addition to CFCs, the folder where you place this file have to mimic the CFCs folder structure so for an instance you'll have to save inside your src folder, inside a folder com, an finally inside a folder myPersonalDomain . src/com/myPersonalDomain, and the AS Package name should be the same as the CFC.

                       

                      Once you're done and click finish, you'll see for files created, one of the the AS VO , and three CFCs.

                       

                      yourDataTable.CFC

                      This is a CFC that creates the VO or DTO in CFC, it has the same properties definition that the AS version has, also the setters and getter for every property.

                       

                       

                      yourDataTableDAO.CFC


                      This CFC contains all the code that handles the database access it a could be an insert, update delete or just a read query.

                       

                      yourDataTableGateway.CFC

                      This is a bridge between your Flex app and your CFCs, it contains a set of methods commonly use when you access a DB, this CFC invocates the methods in the yourDataTableDAO.cfc and returns an object or an array of objects of yourDataTable.CFC type to Flex.

                       

                       

                      In Flex what do you have to do in order to use VOs?

                       

                      1. Add a reference to yourDataTable.as class
                      2. Create a remote object.
                      3. Create the event handler(s)
                      4. Make a call to the remote object.

                       

                      <mx:Script>
                           <![CDATA[
                                     import com.myPersonalDomain;
                                     import mx.controls.Alert;
                                   import mx.rpc.events.ResultEvent;
                                    private var myDummyVar:myDataTable;
                                private function myEventHandler(e:ResultEvent):void{
                                     //do Something
                                     trace(event.result.toString());
                                }
                           ]]>
                      </mx:Script>
                      
                      <mx:RemoteObject id="myRO" destination="ColdFusion"
                      source="com.myPersonalDomain.myDataTableGateway">
                           <mx:method name="getAll" result="myResultHandler(event)"
                      fault="Alert.show(event.fault.toString())" >
                      </mx:RemoteObject>
                      
                      <mx:Button label="Call CF" click="myRO.getAll()" />
                      

                      Well I hope this would help you, I'm kinda tired this has been by far the largest post I've written.

                      • 8. Re: How to use Flex Builders Auto Generated CFCs
                        ProjectedSurplus Level 1

                        Michael, first off, thank you VERY much for your effort here and elsewhere in the forums.  Secondly, to answer you directly, my name is also Mike.  Third, I am going to work through your reply and see where it leads me.  Frankly you are all that is keeping me from running screaming to openLaszlo right now -- I can't believe how discouraging this is (in playing with the wizards last night they overwrote my "example" code so I am literally back at square zero.

                         

                        Wish me luck?!?

                        • 9. Re: How to use Flex Builders Auto Generated CFCs
                          Michael Borbor Level 4

                          Hi Mike, you forgot to uncheck  overwrite files if they already exist, even tough if you're using Flex Builder you can go to previous version files, right clicking over your file - compare with - local history.

                           

                          Don't say that, Fx + CF === FTW !

                           

                          Yes at the very beginning I though  the Wizards did some sort of dark magic because I didn't understand what the heck were those files supposed to do, and how to customize them. But then when you understand them, they're pretty helpful and make you develop prototypes in hours.

                           

                          So good luck! And ping me if  you have any troubles.

                          • 10. Re: How to use Flex Builders Auto Generated CFCs
                            ProjectedSurplus Level 1

                            Fwiw I appreciate how tremendous the wizards (as well as VOs etc) should be,  just am lacking some basic concepts.  So where is where I am atm:

                             

                            THANKS SO MUCH for the flex link directory to server/system directory -- NOW all the tutorials that ASSUME you have done this make a little more sense.  Nonetheless I have not (yet) effected this because I wanted to see the files myself for now even if I have to cut and paste.

                             

                            Hence, I once again have a flex project which can ping a HelloWorld.cfc which is on my REMOTE devserver (not localhost) in the folder:   C:CF8\wwwroot\test\cfcs

                             

                            I then ran the wizard (RDS Dataview connected to my REMOTE devserver) on a table named owners attempting to follow your naming directions but became lost on the remote vs. localhost.

                             

                            Essentially I now have a Flex project as follows:

                             

                            test (ProjectName)

                                 -bin-debug

                                 -html-template

                                 -libs

                                 -src

                                           -cfcs

                                                     -owners.cfc

                                                     -ownersDAO.cfc

                                                     -ownersGateway.cfc

                                           -components

                                                     -component1.mxml

                                           -VOs

                                                     -owners.as

                                 -test.mxml

                             

                             

                            And fwiw I then copied the cfcs, components and VOs folders into my devServer (so they are contained in its  C:CF8\wwwroot\test\ )

                             

                            Yet according to flex error reports named the package(s) incorrectly.  Any thoughts while I play around some more???

                            • 11. Re: How to use Flex Builders Auto Generated CFCs
                              Michael Borbor Level 4

                              You're quite close. I have some free time right now if you want go to https://na2.connectnow.acrobat.com/mabscorp

                              • 12. Re: How to use Flex Builders Auto Generated CFC
                                ProjectedSurplus Level 1

                                    Going there now if you are still online