Welcome!

You will be redirected in 30 seconds or close now.

ColdFusion Authors: Yakov Fain, Jeremy Geelan, Maureen O'Gara, Nancy Y. Nee, Tad Anderson

Related Topics: Adobe Flex, ColdFusion, Machine Learning

Adobe Flex: Article

Your First Adobe Flex Application with a ColdFusion Backend

The wow factor plus usability
By Nahuel Foronda, Laura Arguello
Article Rating:
July 19, 2007 01:30 PM EDT
Reads:
 110,151

However, the compiler still complains that it can't find the TaskItem component. "But I just created it!" you say. The problem is that the main application doesn't know where to find it. Since you saved it in the same folder, you have to indicate that other components can be found there by adding the following attribute to the Application tag in the mytodolist.mxml file:

xmlns="*"

Lastly, declare the taskData variable in your new component (TaskItem.mxml) so that it will finally compile without errors:

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="100%">
   <mx:Script>
     <![CDATA[
       [Bindable]
       public var taskData:Task = null;
     ]]>
   </mx:Script>
   <!-- place other code here -->
</mx:Canvas>

Why wouldn't it compile? Because when you put the tag <TaskItem> in the main application, you also specified the attribute: taskData="{taskList.currentItem}." This was necessary to be able to send the current task to the custom component during each loop of the Repeater. This variable has to be set as bindable so that you can bind to its properties in the controls inside this component.

If you look carefully, you'll see that this variable has the type "Task." This type refers to the ActionScript file automatically generated by the ColdFusion wizard. The properties of this class match exactly those of your Task ColdFusion component.

An instance of the TaskItem component (Figure 5) shows the description and priority of the task and a button to remove the task. As described above, the data is set when the component is instantiated by the Repeater and accessible in the variable "taskData" inside the component.

You can use the Design view to drag an Image, a Label, and a Button and put it in the Canvas. The Properties panel of the Design view shows common properties of the selected component. In that panel, set the text property of the Label as: {taskData.description} and the source property of the Image as: images/priority{taskData.priority}.png. Note that you should have a folder called "images" with an image for every priority you want to show. These images should be called "priorityNUMBER.png," where NUMBER should be replaced with the priority number (i.e.: 1, 2, 3).

Everything should compile, but unfortunately you won't be able to see anything because there's no data.

Getting Data from a ColdFusion Service
To load data from a service, you must use a RemoteObject. The simplest way to use a RemoteObject to call a ColdFusion service is by setting its destination to "ColdFusion" and its source to the path to that component. The application will call two methods on the TaskGateway component (generated by the wizard) so you can specify them explicitly inside the RemoteObject tag. When the response from the service comes back, you want a function to be called. The function to call will be different for each method, so you can specify it in the <mx:method> tag with the "result" attribute. Set the result of the method "getAll" to the function "tasksReceived(event)" and the result of the method "save" to the function taskSaved(event)."

<mx:RemoteObject
    id="myRemoteObject"
    destination="ColdFusion"
    source="mytodolist.taskGateway"
    fault="Alert.show(event.fault.faultstring, 'Error');">
    <mx:method name="getAll" result="tasksReceived(event)" />
    <mx:method name="save" result="taskSaved(event)" />
</mx:RemoteObject>

Inside a script block, implement the tasksReceived function as follows to set the source of the task ArrayCollection to what the service sent as a response of the getAll method:

private function tasksReceived(event:ResultEvent):void {
    tasks = new ArrayCollection();
    tasks.source = event.result as Array;
}

If you open TaskGateway.cfc, you'll see that the method "getAll" returns an array of Task objects. When you set that array to the source of the tasks ArrayCollection, the Repeater will get populated with this data since you declared it as the Repeater's dataProvider.

If Flex Builder didn't add the required import statements automatically, add:

import mx.controls.Alert;
import mx.rpc.events.*;
import mx.events.*;

The other function you need to implement is taskSaved. For now leave it empty; you'll complete it later.

private function taskSaved(event:ResultEvent):void {
}

Everything works, but...you still don't see anything on the screen. That's because you haven't called the service yet. Since you want to load the list of tasks as soon as the application loads, put a function call in the applicationComplete attribute of the Application tag. You'll set it to call a custom function called setUp():

applicationComplete="setUp()"

Then implement the function so that it sends the actual request to the server:

private function setUp():void{
    myRemoteObject.getAll.send();
}

Of course you still won't see anything if your database is empty. To test it out, just add a couple of records manually. You'll build the form to enter new items in the next section.

Published July 19, 2007 – Reads 110,151
Copyright © 2007 SYS-CON Media, Inc. — All Rights Reserved.
Syndicated stories and blog feeds, all rights reserved by the author.

More Stories By 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.

More Stories By 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.

Comments (17) View Comments

Share your thoughts on this story.

Add your comment
You must be signed in to add a comment. Sign-in | Register

In accordance with our Comment Policy, we encourage comments that are on topic, relevant and to-the-point. We will remove comments that include profanity, personal attacks, racial slurs, threats of violence, or other inappropriate material that violates our Terms and Conditions, and will block users who make repeated violations. We ask all readers to expect diversity of opinion and to treat one another with dignity and respect.

Most Recent Comments
??? 10/30/07 01:47:34 AM EDT

Ipod MP4

????
????
????
????
??
????
????
????
???
????
???? 
donna 10/12/07 01:28:46 PM EDT

Unable to download the source code. When I got to page http://www.asfusion.com/projects/my-to-do-list/

I received a Coldfusion error:

A License exception has occurred.
You tried to access the Developer Edition from a disallowed IPThe Developer Edition can only be accessed from 127.0.0.1 and two additional IP addresses. The additional IP addresses are: 209.85.238.20,87.194.221.84

There are so many issues encountered with the tutorial apps out there, that dont work when people follow the isntructions exactly. We need apps that work when followed, and we need downloaded source code that will actually be there.
Lara 07/30/07 11:59:27 AM EDT

I am familiar with ColdFusion but completly new to Flex. I can't get the code to work and I am very frustrated. This isn't a good first application example if we can't work the code. Does anyone have the working source files? If so, please post a link to the corrected files. Thanks!
Jason 06/26/07 02:20:44 PM EDT

I love all the article put out by sys-con and found that they are top quality, that is until this one. I have been struggling with learning Flex and found this article and initally was excited because it looked like the article that was going to clear things up. Until I started in and realized that this article is full of mistakes. Flex is VERY case sensitive where as ColdFusion is not. Since this article is target at ColdFusion developers you need to make sure that the code is correct expecially in the area of case sensitivity because we ususally don't think in that manner (it is "faultString" not "faultstring"). Also you need to make sure that you are using the same name for functions. You have us call the addItem() function through a click event but then on the next page we create the saveItem() function to handle that click event. This won't work! Then we need to make changes to the generated CFCs. You show us the two lines of code that we need to add and simply state that they "should be added to the 'create' method." Ok, but where in the create method. I moved them all over and I continually get errors. I have yet to find a competent article for the Flex "newbie" that achieves its goal of showing how to do basic updates and adds with Flex and CF. I thought that this was going to be the one. Guess I was wrong!
KTK 06/07/07 03:53:09 PM EDT

I'm glad it's not just me! I've had to put this aside for a couple weeks to work on a CF project. Hopefully I can get back to it later this month. If you figure something out, let me know and if I figure it out, I'll let you know. In the meantime, maybe a savior will come along for both of us!
Scott 06/07/07 01:30:06 PM EDT

KTK - I have the same problem and I followed all of the instructions exactly.

Uf!
KTK 06/04/07 01:28:59 PM EDT

I'm getting an error that says "A file found in a source-path must have the same package structure '', as the definition's package, 'Task'. I've been beating my head against it for hours and can't figure out why I'm getting the error. Any ideas?
jex 11/04/06 11:26:10 AM EST

OK - I'm a bit new to both Flex and CF, but have been implementing the tutorial fine up until: "Going back to the main application file (mytodolist.mxml), switch to the design view and drag a new panel and inside drag your EditForm component." When I drag the EditForm component onto the panel, nothing happens. Would it be possible to explain exactly what has to be done here? Many thanks.
jex 11/04/06 11:24:25 AM EST

Problem solved - I was trying to drag the EditForm.mxml - but it's the EditForm component(as it says in the tutorial)which needs to be dragged - this is found in the custom component folder.
jex 11/04/06 10:19:33 AM EST

OK - I'm a bit new to both Flex and CF, but have been implementing the tutorial fine up until: "Going back to the main application file (mytodolist.mxml), switch to the design view and drag a new panel and inside drag your EditForm component." When I drag the EditForm component onto the panel, nothing happens. Would it be possible to explain exactly what has to be done here? Many thanks.
Francois-Yanick Bourassa 08/09/06 04:21:30 PM EDT

I found myself a bit confused to follow this article as it is a bit out of the real target - which is bringing new people to use Flex and ColdFusion. As a ColdFusion programmer, I found very interesting to try this example with Flex. But after couple paragraphs, started to be confused on which file I was suppose to put the code as Flex is a real new thing for me - I'm sure it will be the same for few of us - if it is not more! We use to read article where editor just put rectangle on source code by page - but this article seems to have a different goal!

I will figure out what was wrong in the code because I think I can but what about newbies!!!

This was my personal feedback!
AJAXWorld News Desk 08/09/06 08:35:47 AM EDT

Flex is a complete set of tools to develop rich Internet cross-platform applications based on the Flash platform. With Flex, you can create applications that not only have the 'wow factor' necessary to please clients and users alike, but the 'usability factor' necessary to make your application a real success.
cfdj news desk 08/08/06 08:29:03 PM EDT

Flex is a complete set of tools to develop rich Internet cross-platform applications based on the Flash platform. With Flex, you can create applications that not only have the 'wow factor' necessary to please clients and users alike, but the 'usability factor' necessary to make your application a real success.
CFDJ News Desk 08/08/06 07:25:22 PM EDT

Flex is a complete set of tools to develop rich Internet cross-platform applications based on the Flash platform. With Flex, you can create applications that not only have the 'wow factor' necessary to please clients and users alike, but the 'usability factor' necessary to make your application a real success.
AJAXWorld News Desk 08/08/06 07:11:51 PM EDT

Flex is a complete set of tools to develop rich Internet cross-platform applications based on the Flash platform. With Flex, you can create applications that not only have the 'wow factor' necessary to please clients and users alike, but the 'usability factor' necessary to make your application a real success.
AJAXWorld News Desk 08/07/06 03:11:03 PM EDT

Flex is a complete set of tools to develop rich Internet cross-platform applications based on the Flash platform. With Flex, you can create applications that not only have the 'wow factor' necessary to please clients and users alike, but the 'usability factor' necessary to make your application a real success.
SYS-CON Australia News Desk 08/07/06 09:34:46 AM EDT

Flex is a complete set of tools to develop rich Internet cross-platform applications based on the Flash platform. With Flex, you can create applications that not only have the 'wow factor' necessary to please clients and users alike, but the 'usability factor' necessary to make your application a real success.
@ThingsExpo Stories
By Elizabeth White
As data explodes in quantity, importance and from new sources, the need for managing and protecting data residing across physical, virtual, and cloud environments grow with it. Managing data includes protecting it, indexing and classifying it for true, long-term management, compliance and E-Discovery. Commvault can ensure this with a single pane of glass solution – whether in a private cloud, a Service Provider delivered public cloud or a hybrid cloud environment – across the heterogeneous enter...
Apr. 23, 2018 11:00 AM EDT  Reads: 7,019
By Yeshim Deniz
DXWorldEXPO LLC announced today that ICC-USA, a computer systems integrator and server manufacturing company focused on developing products and product appliances, will exhibit at the 22nd International CloudEXPO | DXWorldEXPO. DXWordEXPO New York 2018, colocated with CloudEXPO New York 2018 will be held November 11-13, 2018, in New York City. ICC is a computer systems integrator and server manufacturing company focused on developing products and product appliances to meet a wide range of ...
Apr. 23, 2018 10:15 AM EDT  Reads: 1,064
By Pat Romanski
More and more brands have jumped on the IoT bandwagon. We have an excess of wearables – activity trackers, smartwatches, smart glasses and sneakers, and more that track seemingly endless datapoints. However, most consumers have no idea what “IoT” means. Creating more wearables that track data shouldn't be the aim of brands; delivering meaningful, tangible relevance to their users should be. We're in a period in which the IoT pendulum is still swinging. Initially, it swung toward "smart for smart...
Apr. 23, 2018 10:15 AM EDT  Reads: 8,749
By Liz McMillan
Major trends and emerging technologies – from virtual reality and IoT, to Big Data and algorithms – are helping organizations innovate in the digital era. However, to create real business value, IT must think beyond the ‘what’ of digital transformation to the ‘how’ to harness emerging trends, innovation and disruption. Architecture is the key that underpins and ties all these efforts together. In the digital age, it’s important to invest in architecture, extend the enterprise footprint to the cl...
Apr. 23, 2018 10:00 AM EDT  Reads: 9,912
By Pat Romanski
Headquartered in Plainsboro, NJ, Synametrics Technologies has provided IT professionals and computer systems developers since 1997. Based on the success of their initial product offerings (WinSQL and DeltaCopy), the company continues to create and hone innovative products that help its customers get more from their computer applications, databases and infrastructure. To date, over one million users around the world have chosen Synametrics solutions to help power their accelerated business or per...
Apr. 23, 2018 09:30 AM EDT  Reads: 2,300
By Pat Romanski
Coca-Cola’s Google powered digital signage system lays the groundwork for a more valuable connection between Coke and its customers. Digital signs pair software with high-resolution displays so that a message can be changed instantly based on what the operator wants to communicate or sell. In their Day 3 Keynote at 21st Cloud Expo, Greg Chambers, Global Group Director, Digital Innovation, Coca-Cola, and Vidya Nagarajan, a Senior Product Manager at Google, discussed how from store operations and ...
Apr. 23, 2018 09:30 AM EDT  Reads: 2,165
By Elizabeth White
In an era of historic innovation fueled by unprecedented access to data and technology, the low cost and risk of entering new markets has leveled the playing field for business. Today, any ambitious innovator can easily introduce a new application or product that can reinvent business models and transform the client experience. In their Day 2 Keynote at 19th Cloud Expo, Mercer Rowe, IBM Vice President of Strategic Alliances, and Raejeanne Skillern, Intel Vice President of Data Center Group and ...
Apr. 23, 2018 09:15 AM EDT  Reads: 6,520
By Liz McMillan
Dion Hinchcliffe is an internationally recognized digital expert, bestselling book author, frequent keynote speaker, analyst, futurist, and transformation expert based in Washington, DC. He is currently Chief Strategy Officer at the industry-leading digital strategy and online community solutions firm, 7Summits.
Apr. 23, 2018 09:15 AM EDT  Reads: 2,660
By Yeshim Deniz
We are seeing a major migration of enterprises applications to the cloud. As cloud and business use of real time applications accelerate, legacy networks are no longer able to architecturally support cloud adoption and deliver the performance and security required by highly distributed enterprises. These outdated solutions have become more costly and complicated to implement, install, manage, and maintain.SD-WAN offers unlimited capabilities for accessing the benefits of the cloud and Internet. ...
Apr. 23, 2018 09:15 AM EDT  Reads: 1,660
By Yeshim Deniz
Founded in 2000, Chetu Inc. is a global provider of customized software development solutions and IT staff augmentation services for software technology providers. By providing clients with unparalleled niche technology expertise and industry experience, Chetu has become the premiere long-term, back-end software development partner for start-ups, SMBs, and Fortune 500 companies. Chetu is headquartered in Plantation, Florida, with thirteen offices throughout the U.S. and abroad.
Apr. 23, 2018 09:00 AM EDT  Reads: 2,797
By Yeshim Deniz
Bill Schmarzo, author of "Big Data: Understanding How Data Powers Big Business" and "Big Data MBA: Driving Business Strategies with Data Science," is responsible for setting the strategy and defining the Big Data service offerings and capabilities for EMC Global Services Big Data Practice. As the CTO for the Big Data Practice, he is responsible for working with organizations to help them identify where and how to start their big data journeys. He's written several white papers, is an avid blogge...
Apr. 23, 2018 09:00 AM EDT  Reads: 3,168
By Liz McMillan
Bill Schmarzo, author of "Big Data: Understanding How Data Powers Big Business" and "Big Data MBA: Driving Business Strategies with Data Science," is responsible for setting the strategy and defining the Big Data service offerings and capabilities for EMC Global Services Big Data Practice. As the CTO for the Big Data Practice, he is responsible for working with organizations to help them identify where and how to start their big data journeys. He's written several white papers, is an avid blogge...
Apr. 23, 2018 08:00 AM EDT  Reads: 2,131
By Pat Romanski
From 2013, NTT Communications has been providing cPaaS service, SkyWay. Its customer’s expectations for leveraging WebRTC technology are not only typical real-time communication use cases such as Web conference, remote education, but also IoT use cases such as remote camera monitoring, smart-glass, and robotic. Because of this, NTT Communications has numerous IoT business use-cases that its customers are developing on top of PaaS. WebRTC will lead IoT businesses to be more innovative and address...
Apr. 23, 2018 06:30 AM EDT  Reads: 6,640
By Pat Romanski
Charles Araujo is an industry analyst, internationally recognized authority on the Digital Enterprise and author of The Quantum Age of IT: Why Everything You Know About IT is About to Change. As Principal Analyst with Intellyx, he writes, speaks and advises organizations on how to navigate through this time of disruption. He is also the founder of The Institute for Digital Transformation and a sought after keynote speaker. He has been a regular contributor to both InformationWeek and CIO Insight...
Apr. 23, 2018 06:00 AM EDT  Reads: 1,791
By Pat Romanski
Gemini is Yahoo’s native and search advertising platform. To ensure the quality of a complex distributed system that spans multiple products and components and across various desktop websites and mobile app and web experiences – both Yahoo owned and operated and third-party syndication (supply), with complex interaction with more than a billion users and numerous advertisers globally (demand) – it becomes imperative to automate a set of end-to-end tests 24x7 to detect bugs and regression. In th...
Apr. 23, 2018 03:15 AM EDT  Reads: 4,463
By Yeshim Deniz
Michael Maximilien, better known as max or Dr. Max, is a computer scientist with IBM. At IBM Research Triangle Park, he was a principal engineer for the worldwide industry point-of-sale standard: JavaPOS. At IBM Research, some highlights include pioneering research on semantic Web services, mashups, and cloud computing, and platform-as-a-service. He joined the IBM Cloud Labs in 2014 and works closely with Pivotal Inc., to help make the Cloud Found the best PaaS.
Apr. 23, 2018 01:00 AM EDT  Reads: 1,988
By Liz McMillan
Cloud-enabled transformation has evolved from cost saving measure to business innovation strategy -- one that combines the cloud with cognitive capabilities to drive market disruption. Learn how you can achieve the insight and agility you need to gain a competitive advantage. Industry-acclaimed CTO and cloud expert, Shankar Kalyana presents. Only the most exceptional IBMers are appointed with the rare distinction of IBM Fellow, the highest technical honor in the company. Shankar has also receive...
Apr. 23, 2018 12:30 AM EDT  Reads: 2,690
By Liz McMillan
"Evatronix provides design services to companies that need to integrate the IoT technology in their products but they don't necessarily have the expertise, knowledge and design team to do so," explained Adam Morawiec, VP of Business Development at Evatronix, in this SYS-CON.tv interview at @ThingsExpo, held Oct 31 – Nov 2, 2017, at the Santa Clara Convention Center in Santa Clara, CA.
Apr. 23, 2018 12:00 AM EDT  Reads: 5,580
By Pat Romanski
Business professionals no longer wonder if they'll migrate to the cloud; it's now a matter of when. The cloud environment has proved to be a major force in transitioning to an agile business model that enables quick decisions and fast implementation that solidify customer relationships. And when the cloud is combined with the power of cognitive computing, it drives innovation and transformation that achieves astounding competitive advantage.
Apr. 22, 2018 11:30 PM EDT  Reads: 2,774
By Yeshim Deniz
The Founder of NostaLab and a member of the Google Health Advisory Board, John is a unique combination of strategic thinker, marketer and entrepreneur. His career was built on the "science of advertising" combining strategy, creativity and marketing for industry-leading results. Combined with his ability to communicate complicated scientific concepts in a way that consumers and scientists alike can appreciate, John is a sought-after speaker for conferences on the forefront of healthcare science,...
Apr. 22, 2018 11:00 PM EDT  Reads: 2,500
MORE »