Dennis Baldwin

Subscribe to Dennis Baldwin: eMailAlertsEmail Alerts
Get Dennis Baldwin: homepageHomepage mobileMobile rssRSS facebookFacebook twitterTwitter linkedinLinkedIn


Related Topics: ColdFusion on Ulitzer, XML Magazine

CFDJ: Article

Let Macromedia Flex Consume Your CFCs

A more programmatic approach to building RIAs

First off, when the application's creationComplete event has fired, we call the CFC and ask for a list of all employees. You'll notice that a WebService object is created and assigned the ID employeeWS. That's what we'll call the instance of this object throughout th e application. The WebService object also has a serviceName attribute, which is bound to a named entry in our flex-config.xml file:

<service name="EmployeeService">
<wsdl>http://localhost/mxdj/Employee.cfc?wsdl</wsdl>
<endpoints>
<endpoint>http://localhost/mxdj/Employee.cfc</endpoint>
</endpoints>
</service>

This adds the Web Service to Flex's whitelist of authorized services. For development purposes you can enable any service to be accessible through the proxy or bypass the proxy altogether.

When the getEmployeeList method of the CFC is called, we handle the result by binding it to the DataGrid control. In Flex this is called Databinding. This is a powerful concept and I definitely encourage you to learn more about it. Databinding can help minimize the amount of code you have to write as well as simplify your design.

Now that the DataGrid is populated let's click on an employee record and you'll see a few items (first name, last name, and email) appear in the form below. This is done using the DataGrid's change event. If you've dealt with change events in the Flash IDE you can appreciate the fact that Flex's approach is cleaner. Each time a record is selected the change event is fired and the appropriate method is designated to handle the event; in our case it's the getEmployee(event) method. This method asks the CFC to return the employee object that matches the ID sent from Flex. You may have noticed that the employee ID is actually in the DataGrid but hidden in a column with zero width. For demonstration purposes I decided to hide the ID but in certain situations it definitely makes sense to show it.

When the employee object is returned from the CFC you'll see the appropriate information displayed in the employee form. The form fields are bound to specific elements in the employee object. Whenever a result is returned, the form is automatically updated. You might notice the difference here compared to the way this has been approached using the Flash IDE. In most instances you'd have to set the value of the each text field explicitly in the result handler (i.e., first_name.text = result[0].first_name). Once again, Databinding makes this process cleaner. Click around on different employee records and you'll see the contents of the form change. Also notice that each time an employee record is selected the mouse cursor changes to an animated clock. This is done with the simple parameter showBusyCursor="true" on the WebService object.

The last feature we'll look at is how employee updates are handled. If you have an employee selected you can modify his first name, last name, or e-mail and click update. You'll see the update take effect instantly. When the update button is pressed a new employee object is created and then passed to the CFC, which in turn updates the database. Instead of retrieving the employee list again, we immediately update the selected entry in the DataGrid. This saves a roundtrip to the server, but leaves you with some work to do for a production environment. I mention this because we don't check that the update was successful before updating the DataGrid.

Conclusion
It's worth noting that with the small amount of code in Listing 1 we added a good deal of functionality and a very rich interface. It's hard to do this in any other technology with as little work, but the ease of use and rapid development comes at a hefty price tag. I can't say that Flex will be the answer to all your RIA woes, but it's definitely worth considering if you're involved in enterprise development. Before you balk at the price tag I recommend downloading the 60-day eval and giving it a run. Macromedia has also announced an Eclipse plug-in, code named Zorn, that enables Flex application development in one of the industry leading IDEs. When it comes to your next project, or if you're looking for a change, consider Flex.

More Stories By Dennis Baldwin

Dennis Baldwin is a software developer for SensorLogic Inc, an M2M application service provider. He also runs and maintains an online community for Flash and ColdFusion developers at www.devmx.com.

Comments (1) 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
JDJ News Desk 08/03/05 02:02:26 PM EDT

Let Macromedia Flex Consume Your CFCs. In previous articles I've written about the power of integrating Flash and ColdFusion to build Rich Internet Applications (RIAs). In this paradigm Flash provides the user interface while ColdFusion is responsible for handling the business logic and sending data to Flash either through Flash Remoting or Web Service calls. In this article I'd like to shift focus a bit and provide a more programmatic approach to building RIAs. By this I mean using XML to create the Flash interface. The answer lies in Macromedia's Flex.