About ColdFusion components

ColdFusion
component (CFC) files let you encapsulate application and business logic
into self‑contained, reusable units. CFCs also provide a fast, easy
way to create web services.

A CFC is a reusable software unit written in ColdFusion markup
language (CFML), which makes it easy to reuse and maintain your
code.

You can use Dreamweaver to work with CFCs.
For information on CFC tags and syntax, see the ColdFusion documentation
from within Dreamweaver (Help >
Using ColdFusion).

Note:

You can use CFCs only with ColdFusion MX or later. CFCs are
not supported in ColdFusion 5.

CFCs are meant to provide a simple yet powerful way for developers
to encapsulate elements of their websites. Generally, you should
use components for application or business logic. Use customs tags
for presentation elements such as customized greetings, dynamic
menus, and so on.

As with many other types of construction, dynamic sites can often
benefit from interchangeable parts. For example, a dynamic site
may run the same query repeatedly, or calculate the total price
of shopping cart pages and recalculate it every time an item is
added. These tasks can be handled by components. You can fix, improve,
extend, and even replace a component with minimal impact to the rest
of your application.

Suppose an online store calculates shipping charges based on
the price of orders. For orders under $20, the shipping charge is
$4; for orders between $20 and $40, the shipping charge is $6, and
so on. You could insert the logic for calculating the shipping charge
in both the shopping cart page and the checkout page, but that would
mix HTML presentation code and CFML logic code and generally make
the code difficult to maintain and reuse.

You decide to create a CFC called Pricing that has, among other
things, a function called ShippingCharge. The function
takes a price as an argument and returns a shipping charge. For
example, if the value of the argument is 32.80, the function returns
6.

In both the shopping cart page and the checkout page, you insert
a special tag to invoke the ShippingCharge function.
When the page is requested, the function is invoked and a shipping
charge is returned to the page.

Later, the store announces a special promotion: free shipping
for all orders above $100. You make the change to the shipping rates
in one place—the ShippingCharge function of the
Pricing component—and all the pages using the function automatically
get accurate shipping charges.

Components panel overview (ColdFusion)

Use the Components panel (Window >
Components) to view and edit ColdFusion components, and add code
in the page that invokes the function when the CFM page is requested.

Note:

The
Components panel is available only when viewing a ColdFusion page
in Dreamweaver.

Create or delete a CFC in Dreamweaver

You can use Dreamweaver to visually define a CFC and its functions. Dreamweaver creates a .cfc file and inserts the necessary CFML tags for you.

Note:

Depending on the component, you may have to complete some code by hand.

a.In the Components section, enter the details about the component. Here is a partial list:

Name Specifies the filename of the component. The name must contain only alphanumeric characters and underscores (_). Don’t specify the .cfc file extension when entering the name.

Component Directory Specifies where the component is saved. Select the web application’s root folder (such as \Inetpub\wwwroot\myapp\) or any of its subfolders.

b.To define one or more functions for the component, select Functions from the Section list, click the Plus (+) button, and enter the details of the new function.

Ensure that you specify the type of the value returned by the function in the Return Type option.

Note:

If you select remote from the Access menu, the function becomes available as a web service.

c.To define one or more arguments for a function, select
Arguments from the Section list, select the function from the pop‑up
menu, click the Plus (+) button, and enter the details of the new
argument on the right.

If you use a remote development server, upload the CFC file and any dependent files (such as those used to implement a function or include files) to the remote server.

Uploading the files ensures that Dreamweaver features
such as Live view and Preview In Browser work properly.

Dreamweaver writes a CFC file and saves it
in the folder you specified. The new component also appears in the
Components panel (after clicking Refresh).

If you use a remote development server, upload the CFC file and any dependent files (such as those used to implement a function or include files) to the remote server.

View CFCs in Dreamweaver

Dreamweaver provides a way to visually examine the ColdFusion components (CFCs) located in your site folder or on the server as a whole. Dreamweaver reads the CFC files and displays information about them in an easy-to-navigate tree view in the Components panel.

Dreamweaver looks for the components on your testing server (see Connecting to the database in Dreamweaver). If you create CFCs or make changes to existing CFCs, make sure to upload the CFC files to the testing server so they are accurately reflected in the Components panel.

To view components located on another server, change the testing server settings.

You can view any of the following information about your CF components:

List all of the ColdFusion components defined on the server.

If you’re running ColdFusion MX 7 or later, filter the list to show only the CFCs located in your site folder.

Explore the functions and arguments of each component.

Inspect the properties of functions that serve as web services.

Note:

To use Dreamweaver to inspect CFCs residing in the server root while also managing your site files in a different website root, you can define two Dreamweaver sites. Set the first site to point to the server root and the second to point to the website root. Use the site pop-up menu on the Files panel to switch quickly between the two sites.

The components package is displayed on the server. A component
package is a folder that contains CFC files.

If existing
component packages do not appear, click the Refresh button in the panel
toolbar.

To display only the CFCs located in your site folder,
click the Show Only Current Site’s CFCs button in the Components
panel toolbar.

Note:

This feature is available only if you’ve defined a computer
running ColdFusion MX 6 or later as a testing server for Dreamweaver.

Note:

If the current site
is listed in a virtual folder on the remote server, the filtering does
not work.

Click the Plus (+) button beside the package name to
view the components stored in the package.

To list the functions of a component, click
the Plus (+) button beside the component name.

To see the arguments a function takes, as well as
the arguments’ type and whether they are required or optional, open
the function’s branch in the tree view.

Functions that take
no arguments have no Plus (+) button beside them.

To quickly view the details of an argument, a function,
a component, or a package, select the item in the tree view, and
click the Get Details button in the panel toolbar.

You can
also right-click (Windows) or Control-click (Macintosh) the item
and select Get Details from the pop‑up menu.

Details about
the item are displayed in a message box.

Edit CFCs in Dreamweaver

Dreamweaver provides
a streamlined way of editing the code of the ColdFusion components
defined for your site. For example, you can add, change, or delete
any component function without leaving Dreamweaver.

To
use this feature, your development environment must be set up as
follows:

ColdFusion must be running locally.

In the advanced Site Definition dialog box in Dreamweaver, the Access type specified in
the Testing Server category must be Local/Network.

In the advanced Site Definition dialog box, the path of your
local root folder must be the same as the path of the testing server
folder (for example, c:\Inetpub\wwwroot\cf_projects\myNewApp\).
You can examine and change these paths by selecting Site >
Edit Sites.

The component must be stored in the local site folder or
any of its subfolders on your hard disk.

Open any
ColdFusion page in Dreamweaver and display
the components in the Components panel. To display the components,
open the Components panel (Window > Components), select
CF Components from the panel’s pop‑up menu, and click the Refresh
button on the panel.

To edit the CFC recordset visually, double-click
it in the Bindings panel.

To edit a component file generally, open the package
and double-click the component name in the tree view.

The component’s file opens in Code view.

To edit a specific function, argument, or property, double-click
the item in the tree view.

Make your changes by hand in Code view.

Save the file (File > Save).

To see any new function in the Components panel, refresh
the view by clicking the Refresh button on the panel toolbar.

Build web pages that use CFCs

One way to use a component function in your web pages is to write code in the page that invokes the function when the page is requested. You can use Dreamweaver to help you write this code.

Note:

For other ways to use components, see the ColdFusion documentation from within Dreamweaver (Help > Using ColdFusion).

In Dreamweaver, open the
ColdFusion page that will use the component function.

Switch to Code view (View > Code).

Open the Components panel (Window > Components),
and select CF Components from the panel’s pop‑up menu.

Find the component you want and insert it using one of
the following techniques:

Drag a function from the tree view to the
page. Code is inserted in the page to invoke the function.

Select the function in the panel and click the Insert
button on the panel toolbar (the second button on the right). Dreamweaver
inserts the code in the page at the insertion point.

If you insert a function that has arguments, complete
the argument code by hand.

For more information, see the ColdFusion documentation
from within Dreamweaver (Help >
Using ColdFusion).

Save
the page (File > Save).

Define a recordset in a CFC

Dreamweaver can help you define a recordset (also known as a ColdFusion query) in a ColdFusion component (CFC). By defining a recordset in a CFC, you don’t need to define the recordset on each page that uses it. You define the recordset once in the CFC and use the CFC on different pages.

Define dynamic content by using
a CFC

You can define a recordset as a source of
dynamic content in Dreamweaver by using a
CFC that contains a recordset definition.

1.In the Name box, enter a name for the CFC recordset.

A common practice is to add the prefix rs to recordset names to distinguish them from other object names in the code, for example: rsPressRelease.

Recordset names must contain only alphanumeric characters and underscores (_). You cannot use special characters or spaces.

2.Select a package from the ones already defined on the server.

If the package does not appear in the pop‑up menu, you can refresh the list of packages by clicking the Refresh button near the pop‑up menu.

Make sure you upload your CFCs to the testing server first. Only CFCs on the testing server are displayed.

3.Select a component from the ones defined in the currently selected package.

If the Component pop‑up menu does not contain any components, or if none of your previously created components appear in the menu, you should upload the CFC files to the testing server.

4.(Optional) To create a component, click the Create New Component button.

a.In the Name box, enter the name for the new CFC. The name must contain only alphanumeric characters and underscores (_).

b.In the Component Directory box, enter the location for your CFC, or browse to locate the folder.

Note:

The folder must be the relative path to the site root folder.

5.From the Function pop‑up menu, select the function that contains the recordset definition.

The Function pop‑up menu contains only the functions defined in the currently selected component. If no function appears in this pop‑up menu, or if your last changes are not reflected in the currently listed functions, check that your last changes were saved and uploaded to server.

Note:

The Connection and SQL boxes are read-only.

6.Edit each parameter (type, value, and default value) that must be passed as a function argument by clicking the Edit button.

a.Enter a value for the current parameter by selecting the value type from the Value pop‑up menu and entering the value in the box to the right. The value type can be a URL parameter, a form variable, a cookie, a session variable, an application variable, or an entered value.

b.Enter a default value for the parameter in the Default Value box. If no run-time value is returned, the default parameter value is used.

c.Click OK.

You cannot modify the database connection and the SQL query for the recordset. These fields are always disabled—the connection and SQL query are displayed for your information.

7.Click Test to connect to the database and create an instance of the recordset.