Your First Adobe Flex Application with a ColdFusion Backend

The wow factor plus usability

Jul. 19, 2007 01:30 PM

Receiving Responses from the Server
If you recall, when you created the RemoteObject, each of the methods of the RemoteObject tag specified a function to be called when the response came back from the server:

<mx:method name="getAll" result="tasksReceived(event)" />
<mx:method name="save" result="taskSaved(event)" />

You already implemented the tasksReceived() function but left taskSaved() incomplete. This function will be called either because a new task was added or because a task was set as done. In each case, you should do something different. You could also implement two different methods in the service if you'd like to separate them.

If a new task was created, you want to add it to the main list of tasks, that is, to the "tasks" ArrayCollection that feeds the Repeater. If the task was updated (set as done), you want to remove it from the list.

private function taskSaved(event:ResultEvent):void {
    var taskItem:Task = event.result as Task;
    var i:Number = -1;
    if (taskItem.done){//we must remove it
      //find task in list
      for each (var thisTask:Task in tasks){
        i++;
        if (thisTask.id == taskItem.id){
          //remove this item
          tasks.removeItemAt(i);
          break;
        }
      }
    }
      else {
        tasks.addItem(taskItem);
    }
}

Making Changes to the Generated ColdFusion Components
To make everything work, you'll have to make a couple of changes in the generated ColdFusion components. First you'll need to make the Task component generate a unique key before storing the data in the database:

That should be added to the "create" method.

Then your TaskGateway component should return the task it got in the "save" method:

While you're at it, you may also want to change the getAll method so that it returns only the undone items, or you may want to delete the task when it's set as done.

Final Touches
As a final touch, you can add styling information to the application and to each individual control. An application-wide style file can be added by using the

As you can see, integrating Flex with ColdFusion is very simple and the CFC wizards greatly simplify the task. In addition, with the new Flex/ColdFusion connectivity features, you can send object instances from Flex to ColdFusion and from ColdFusion to Flex as if they were instantiated locally like you did with the Task.cfc-Task.as class mapping.

We hope this sample application gets you started using Flex and ColdFusion together to offer your users a nicer experience. We've only scratched the surface with this article; you can do much more with Flex. As your next steps, you can look at the sample code, read the tutorials at Adobe, and get your feet wet with an application of your own.

Published Jul. 19, 2007— Reads 82,168 — Feedback 17
Copyright © 2007 SYS-CON Media, Inc. — All Rights Reserved.
Syndicated stories and blog feeds, all rights reserved by the author.

About Nahuel Foronda
Nahuel Foronda is one of the founders of Blue Instant (http://www.blueinstant.com), a web development firm specializing in Rich Internet Applications where he has been creating award-winning applications and offering training for the last five years. He also maintains a blog, called AS Fusion (http://www.asfusion.com), where he writes about Flash, ColdFusion and other web technologies.

About Laura Arguello
Laura Arguello is one of the founders of Blue Instant (http://www.blueinstant.com), a web development firm specializing in Rich Internet Applications where she has been creating award-winning applications and offering training for the last five years. She also maintains a blog, called AS Fusion (http://www.asfusion.com), where she writes about Flash, ColdFusion and other web technologies.

Your Feedback

Your First Adobe Flex Application with a ColdFusion Backend

??? wrote: Ipod MP4 ???? ???? ???? ???? ?? ???? ???? ???? ??? ???? ????