Accessibility

ColdFusion Article

 

Building your first data management application with ColdFusion and Flex


Table of Contents

  1. Introduction
  2. Creating a Flex 3 project
  3. Using the ColdFusion 8 extensions for Eclipse and Flex Builder
  4. Configuring ColdFusion 8 and LiveCycle Data Services ES
  5. Filling the Data Grid
  6. Bringing it all together

Creating a Flex 3 project

Start by choosing File > New > Flex Project (see Figure 1).

Figure 1

Figure 1. Creating a new Flex project.

Use the New Flex Project wizard (see Figure 2) to set up the project.

Figure 2

Figure 2. The New Flex Project wizard.

Project name and location:

You may type any name for the project. In this example, the project is named “myProject”. You may also change the location of the project – where are all your files are stored – from the default presented to you.

Application type:

For the Application type, select Web Application, which is the default. The application type determines what the compilation step will produce; in this case a SWF file is created when the project is compiled.

Server technology:

For the application server type select ColdFusion. Make sure Use remote object data service is selected and LiveCycle Data Services ES is selected.

Click Next to proceed to ColdFusion server setup (see Figure 3).

How you configure the project to work with the ColdFusion server depends on how ColdFusion 8 was installed. There are two different install options for installing ColdFusion 8: standalone and multiserver. If you installed using the multiserver option, then select “Deployed to J2EE Server” (see Figure 3). If you accepted the default options for the multiserver install then your web root will be C:\JRun4\servers\cfusion\cfusion-ear\cfusion-war. You can browse to this directory by opening the URL http://localhost:8300/ in your browser.

Figure 3

Figure 3. Configuring ColdFusion server.

If you are using Microsoft Internet Information Server (IIS) or Apache with your ColdFusion install, you will need to specify a different web root. If so, make sure to deselect “ColdFusion WAR is located in the web root”, and specify the location of the ColdFusion WAR folder. For example, if you are using IIS with a web root at C:\Inetpub\dev.icm.com and a custom site for the Root URL you would use the wizard to specify that configuration (see Figure 4).

Why do you have to point to the WAR folder? In the following sections, you will edit a configuration file in the ColdFusion server installation directory tree. Flex Builder looks for this file in the WEB-INF folder that is located under the ColdFusion WAR folder.

Figure 4

Figure 4. An example configuration when using IIS.

After modifying these settings as needed, click Validate Configuration. At the top of the dialog box you should see the following message: “The web root folder and root URL are valid”. If not, check your settings to ensure you have correctly set up all required paths. If your settings are valid, click Next.

In the next step you have an opportunity to set the build paths for your project. Leave the defaults set here (see Figure 5). If you had another folder with code you wanted to use in this project, you could add that folder to the Flex project’s build path.

Figure 5

Figure 5. Configuring additional source folders.

Now all the configuration options for the project are set; click Finish.

In the Flex Navigator view you will see the new project created along with several default folders (see Figure 6).

Figure 6

Figure 6. The Flex Navigator view.

Next, right-click the src folder, select New > Folder, type com/adobe/devnet/example, and click OK. The new folder should appear in the folder structure (see Figure 7).

Figure 7

Figure 7. The example folder created in the folder structure.

To ensure you are using the latest Flex SDK, right-click on the myProject folder Navigator view and select Properties from the context menu. When setting up the project Flex Builder detected the SDK on the server. Because the server does not have the latest SDK, Flex Builder set the project to use an SDK matching the server, most likely 2.0.1. Under the Flex SDK version, select the Flex 3 SDK and click OK. You will be prompted that Flex Builder will rebuild the project and delete files under the html-template folder; this is fine and will not hurt your project. Click Continue.

Figure 8

Figure 8. Selecting the Flex 3 SDK.

Page 2 of 6
Previous Page
Next Page