The relationship between client code and server code in
Flex differs from the traditional relationship in a server template.
In a traditional relationship, a server template mixes server
code with client code. When the client queries a database, it dynamically
embeds HTML code with returned data.
Flex, however, separates client code from server code. The remote
service returns only data. Flex binds the returned data to user
interface components in the client application.
In Flash Builder, select New > Flex Project to create
a ColdFusion server project. Name the project Books.
Application Server Type to ColdFusion. Enable Use Remote Object Access
Service and select ColdFusion Flash Remoting.
Click Next. Validate your configuration.
Set the output folder to the books folder
containing the service. Click Finish.
Flash builder creates Books.mxml and
opens the file in the MXML editor.
Select Design to open the
editor in Design mode.
In Design mode, drag a DataGrid control to the design area.
DataGrid control is available under Controls in the Components view.
From the context menu for the DataGrid, select Bind to Data.
In the No Services Defined dialog, click Yes to connect to
In the Connect to Data/Service wizard, select ColdFusion.
Flash Builder provides multiple
ways to connect to a data service. In this scenario, you first create
the user interface. Then from a user interface component, you connect
to a service and specify the remote operation.
Click Browse and navigate to the BookService.cfc you
created previously. Click Finish.
Provide authorization credentials
as needed for your system.
The Data Services View now displays
Again, from the context menu for the DataGrid, select Bind
The Bind to Data dialog now opens with New Service
BookService is the only service available
in the Flex project.
getBooks() is the only
operation available in the service.
In the Bind to Data dialog, select Configure Return Type
to define the data type for returned data.
Flex uses the return
data type to access service operations. The BookService service
does not define the data type for returned data. Flash Builder uses client-side
typing to define a custom data type for the returned data.
Some services, such as those provided by LiveCycle
Data Services, provide server-side typing. With server-side typing,
Flash Builder does not have to configure the data type for returned
In the Configure Return Type dialog, Auto-Detect the Return
Type is selected by default. Click Next.
Flash Builder introspects
the service to determine the data and data types returned.
Specify Book in the Array Of field
to define a custom type for returned data.
returns an array of records from the data service. Each record is
a complex data type representing a database record for a book. The
custom type Book provides access to each field of the record.
Configure Return Type dialog displays the properties of the data
type returned by the service. Click Finish.
Flash Builder configures a return type, it accesses the database
to create a value object. The properties of the custom data type
are derived from the value object. You can view the properties of
the data type before proceeding.
In the Bind to Data dialog, click OK.
binds the data returned from the service call to the DataGrid component.
It modifies the columns of the DataGrid, binding the value returned
for each Book property to a column in the DataGrid.
Make sure the DataGrid is still selected. In the Properties
view, click Configure Columns and then do the following steps:
Select the ISSPOTLIGHT column. Click Delete to delete the
Delete all columns except TITLE and GENRE.
Select the TITLE column. Edit the Header Text field to rename
the column Title.
Rename the GENRE column to Genre.
With the GENRE column selected, click Up to rearrange the
order of the columns.
In Design View, grab the far left handle of the DataGrid
and resize it to a more normal shape. Save and run the application.