Record Store: Your First ColdFusion MX

Application in Dreamweaver MX
The MX family of products represents a new generation of products from Macromedia.
The most significant feature of the MX family of products is the great way in which they
let you work with data in your web pages. If you are reading this, you probably have been
looking at how to move your site to a new level by making it dynamic. This tutorial will
teach you to build a simple application using Dreamweaver MX and ColdFusion MX and
will help you understand a few best practices of application design.
In this tutorial, you will build a catalog for an online music label, Record Store. Youll
learn to:
Create a page to view the details of each album.
Build a page that lets you view, add, and update records.
There will be a discussion about deleting records and you will modify your pages
to allow you to hide records from your user.
And, believe it or not, you are going to do NO hand coding. You aren't even going to
look at the code view once. Best of all, you are going to learn quite a bit. Promise...
When you complete this tutorial, you should be able to create a simple application for
ColdFusion MX in Dreamweaver MX. You will also have a nice set of examples for you
to keep as reference files as you get deeper into ColdFusion Markup Language (CFML).
Working with databases may be new for you. Don't be intimidated. Beneath all the terms,
this is all pretty simple. If you find yourself getting a little confused, take break and come
back to give it another shot. You may also want to look for some basic articles on what a
database is and how it works. These articles can be found on the Macromedia DesDev
Center at: http://www.macromedia.com/desdev/topics/databases.html

System requirements
To complete this tutorial you will need to:
1. Install Dreamweaver MX locally on your machine.
2. Install ColdFusion MX locally on your Windows 2000 or higher PC.
Note: While it is possible to use a remote server for testing and authoring on
Macintosh or Windows, this tutorial is designed for working with the files locally.
For information on downloading and installing ColdFusion MX, go to
http://www.macromedia.com/coldfusion and click on the link for the latest
downloadable version.
Read the requirements for ColdFusion MX before you install.

If you do not run this tutorial on a machine with a local ColdFusion MX server,
the steps in this tutorial will not work exactly the same way as they are written.
3. Learn the basics of Dreamweaver. There are points in this tutorial when you can
style tables and components of the pages. While you are not required to make any
adjustments to formatting, the tutorial offers some suggestions but no specific
directions. If you choose not to apply the suggested changes, simply continue on
with the tutorial.
4. (Optional) Set your local web server to allow directory browsing when you are
working on this tutorial. This is optional, but this may make it easier to select
individual pages in the browser.

Installing the sample files

Start by unzipping the sample files to a folder on your desktop. The folder will include:

A folder of sample files called RecordStoreCFStart.

A folder of completed files that you may look through called
RecordStoreCFEnd.
Note: These files may not run on your machine, because of system-specific
configuration you may have. If these files do not run, the files that you create
yourself on your machine from the sample files will work.
A folder called RecordStoreCFTutorial that contains this tutorial for you to use
off-line.

Make a copy of the RecordStoreCFStart, and copy it to the web root of your web server
where ColdFusion MX is installed. This should be the same folder that you set as the root
in your Dreamweaver Site Definition.
After you have moved the files to the right location, you need to create a datasource in
the ColdFusion Administrator. To do that, you open the ColdFusion Administrator and
click on the Data Sources in the left hand column. Add a New Data Source, use the
Micosoft Access driver, navigate to the RecordStoreCFStart folder and select the
recordstore.mdb file. Check the Use Default Username box when you create the data
source.
Once the data source is built, you can click OK and then verify the data source in the
ColdFusion MX Administration. If the data source verifies, you are all set. If it doesn't,
check to see that you have checked the Use Default Username box.
Note: Some of the user interface features are not implemented in the sample files. The
top navigation links and buttons are disabled intentionally. This keeps extra code to a
minimum so that you can easily study the code that you are going to insert.

Creating the customer facing site

Start by creating the customer-facing part of the site. Your customer will want to see all
the albums in your catalog when they come to the site for the first time. You want to

present them with that necessary information on the first page of the site. The
administration site, where you can add and modify records, will come later.

Creating the site

The very first thing you need to do when you are working on a new application is to
create a site. Just like a static site, Dreamweaver MX needs to know where all your assets
are, and where your server is as well as its URL.
1. Open Dreamweaver MX, and close the blank page.
2. Check to see if your Site panel is open. If it isn't, go to the Window menu and
select Site or press F8.
3. On the left side of the panel, there is a pop up menu that shows the current site.
Click the site pop up menu and select Edit Sites.
4. Click the New button and name the site "RecordStoreCFStart".
5. Set the local root folder to be the RecordStoreCFStart folder. To do this, click the
folder icon next to the Local Root Folder text box, and browse to the
RecordStoreCFStart folder that you placed in your webroot folder when you
installed the files.
6. Check the refresh local files automatically check box and ignore the default
images and the HTTP address.
When you are finished, you Site Definition Local Info category should look like
this:

7. In the Category list, select Remote Info. Click the pop up menu and select Local
Network. Set your Remote Folder to be the same as the local folder info path that
you just set. You don't need to turn on the CheckIn/CheckOut for this tutorial,
although this feature is handy in a work group situation. It is very useful if you
maintain your site from multiple machines, like home and work.
Your Site Definition Remote Info category should look like this:

8. In the Category list, select Testing Server. Choose ColdFusion as the Server
Model.
9. In the Access pop up menu, select Local Network. If it doesn't point to the local
folder where your files are, set it now.
10. Within the URL Prefix field, set the location of the local server. Your address is
probably going to be http://localhost/recordstorecfstart if you have ColdFusion set
up to work with most web servers. If you have it set to use the ColdFusion MX
stand alone web server, the address is going to port number 8500. The URL Prefix
will be http://localhost:8500/recordstorecfstart. Note that it needs to be set in
lowercase for the URL Prefix field.
Your Site Definition Testing Server should look like this:

11.

The URL Prefix should be added automatically when you select Local/Network
from the Access pop up menu. It should be all lower case as you see here even
though it does not match the other instances of the path.
Click OK and close the Site Definition dialog box. Click Done in the Edit Sites
dialog. Your site is now defined.
Your site panel should look like this:

Creating the catalog page

Now that you have a site to work in, you can start creating your application.
1. From the File Menu, select New or press Ctrl-N to get the New Document dialog.
2. In the New Document Dialog Box, select the Template tab. Dreamweaver MX
lists all the templates for the sites that you have set up. You want to select the
RecordStoreCFStart site in the Templates For column and you will see one
template for recordstore called recordstore_template. Click on that to select it and
click on the Create button.
3. When you create a page from a template, Dreamweaver makes a page with all the
features of the template ready for you to type into. First thing to do though is to
save the page and give it a name.
4. Select File Save. Save the file to your RecordStoreCFStart folder and call it
catalog.cfm.
In the file you will see the standard sort of look and feel of a page with graphics and
tables already built and placed.
There are four editable areas on the page: Title Bar Sidebar, Title Bar Main Area, Sidebar
Content, and Main Area Content. These areas are the only part of the template that we
have access to while we are working. Templates let you create pages that other people
can edit without letting them change areas of the page that need to remain consistent
across the site. If you are interested in learning more about templates, you may want to
check the Dreamweaver MX documentation available under the Help Menu.
In this page, there is a sidebar with the latest news and an area for all the albums to be
displayed. The titles for each sidebar are static and are not going to change from day to
day. However, the latest news and the catalog of albums will change frequently as new
records are released.

Linking to the database

Add links to your database and view the data live in Dreamweaver MX.

1. Click in the editable area for the Title Bar Sidebar and delete the sample text and
type, "Latest News".
2. Click in the editable area for the Title Bar Main Area and delete the sample text
and type, "Catalog".
3. Open the Bindings panel. If it is not open, select Bindings from the Window
menu.

4. In the Bindings panel, you see some instructions for you to add data to the page. If
step 2, Choose document type, is not checked, click on the link in the instructions
and select ColdFusion from the Choose Document Type dialog.
button and add a Recordset (Query)
5. Click the
This is the code that is sent to the database to select the data that is going to be
displayed back in the page.
Fill out the Recordset dialog as you see here. If you see a larger dialog box with
different fields, click on the Simple button to get to this dialog.

6. Set the name of the query to "LatestNews". This is how you are going to refer to
this query in the code when you want to access the information that this query is
going to return.
7. Set the data source to RecordStoreCFStart which you set up when you installed
the sample files. If you don't have a data source set up, you need to set one up in
the ColdFusion MX administrator.
8. Since there is no password on this database (which is really bad practice and only
done for the sake of this example) so you don't need to enter any values there.
9. For the Table, select News. There are three tables in this data source, but you
want the news.
10. You aren't going to select individual Columns, you are going to select all the data.
If you have a table with a lot of columns, you want to only select the columns that
you are going to use to save memory on your query, which will generally make
that query come back a lot faster.
11. You don't want to set a filter up at this point. That would limit the records found
to records that match a particular criteria that you would select from the
dropdown menu.
12. In the Sort item you do want to select a sort on the NewsDate. Set the order to
Descending, which will return the records in the order of the most recent to oldest
item. The default is Ascending. This way you can display one or two items in a
list and only the most recent records will show.
13. Click OK to create the recordset and insert it in your page.

Applying dynamic data to the page

Now you have a recordset, or in ColdFusion terms, a Query, on the page and you can
now bind the columns of that recordset to various spots on your page. In this example,
you want to bind the data to the Sidebar Content so that that sidebar always shows the
latest piece of news.
1. Click in the Side Bar Content editable area and delete the content.
2. Make sure that you can see the Bindings Tab of the Application panel. If you can't
see it, then open the Bindings panel from the Window Menu.
3. Expand the LatestNews recordset on the Bindings panel.

Each entry represents a column in the database. Each column is a piece of data
that you can bind to things on the page.
4. Select the NewsDate item and drag it to the empty editable area for the Side Bar
Content.
You now see a placeholder on your page that indicates that the spot is going to be
replaced by the date from the database.
5. Select the News Item and drag it and drop it next to the NewsDate placeholder on
your page. Add a dash between the two placeholders to make it easier to see the
end of the date and the beginning of the news.

To see your data live you can preview your page in the browser, but it is easier to just
turn on the Dreamweaver MX' Live Data feature. To do that, click on the Live Data
Mode icon in the toolbar.

Dreamweaver MX should now show the actual data from the database here in the page as
you work.
This data, while live, is not editable. You can't select the type and correct a spelling error
or add some text. What you can do is select the text and apply styles to the item. You can
add both HTML and CSS styles to the dynamic content.

You probably don't want the date to look like the way it appears. Dreamweaver lets you
fix that easily.
1. Select the date in your sidebar. The date is that long bit {ts '2002-04-28
00:00:00'}
2. In the Bindings panel, note that the NewsDate is selected already. If you scroll
along to the far right of that panel, you will see a pop up menu where there are
many formats for you to choose from. Drag down to Date/Time and select the
model marked 1/17/00. Your page will update automatically if you have the Auto
Refresh box checked. If the page doesnt update, click the refresh button at the top
of the document window.
3. Save your page.
You have a binding to the data from the page and can see the data come in and preview
as you work in Live Data Mode. The next Recordset you are going to enter is a little
more complicated.
For the Catalog, you want to display a complete set of information. You need to display
the following items: a thumbnail of the cover of the album, the name of the album, the
name of the band, the type of music and the price.
There are a couple ways to think of this data. You can think of it as based on the name of
the album or you can think of it based on the name of the group. If you think of the data
as records based on the name of the album then there are as many records in the database
table as there are albums. If you think of the data as based on the names of the group,
there would be as many entries in that table as there are groups and some of those would
have more than one album they have released.

One way of handling that is to join two tables. That way you can keep track of both the
albums and the groups separately and relate the two sets of data. You want to join tables
if you wanted to keep parts of your data accessible for change. For instance, if the Grape
People, my favorite band, added a new band member or changed their name, then I would
want to change that information in one place, not for each of the many albums they have
produced.
Another great reason to separate the different sets of information into more than one
database table is to keep people from entering information into the database with spelling
errors or content errors. If you or your customer is entering the name of the company
every time they make an record in the database, then that is an area ripe for typos that end
up costing you money. Imagine that everyone working with the database all dealing with
the Chrysanthemum Corp, spelling that "Chrisandthemum", "Chrysandthemum" or
"Chrisanthnum". If they do that, then you now have records for the same company under
four different names.
In short, you use relational tables to:

Organize your data into like sets

Enforce integrity of your data
Break out information so that you can access just the portions you need

For the next dataset you are going to join two tables.
1. Open the Bindings panel. If it is not open, select Bindings from the Window
Menu.
2. Click on the "+" button and add a Recordset (Query)
This time though you want to click on the Advanced button to get to the advanced
version of the Recordset dialog box.
Fill out the Recordset dialog box as follows:

3. Set the name of the query to "Catalog". This is how you are going to refer to this
query in the code when you want to access the information that this query is going
to return.
4. Set the data source to RecordStoreCFStart.
5. Since there is no password or username for this database so you don't need to
enter any values there.
6. You can simply type in the SQL if you know your SQL. But you are going to
build that query in a couple steps.
7. You don't need any page parameters, so leave that area blank.
8. In the Database Items area, expand the Tables entry. You should see three tables
there; Artist, Album, and News.
9. Click on the Album table without expanding it, and press the Select Button. The
SQL Query now reads:
SELECT *
FROM Album

10. Click on the Artist table without expanding it and press the Select Button. Now
the SQL Query reads:
SELECT *
FROM Album, Artist
Now you have selected all the data from both tables, but there is no relationship
between the tables, there is no way to use them together.
11. Expand the Album table, select the ArtistID entry and press the Where button.
Now the Query reads:
SELECT *
FROM Album, Artist
WHERE Album.ArtistID
12. Expand the Artist table and select the ArtistID entry and press the Where button.
Now the Query reads:
SELECT *
FROM Album, Artist
WHERE Album.ArtistID AND Artist.ArtistID
you need to change the AND to an "=" sign.
13. Now you need to set the sort order. Expand the Album table and select the
AlbumName entry and click on the Order By button. Your final SQL should look
like this:
SELECT *
FROM Album, Artist
WHERE Album.ArtistID = Artist.ArtistID
ORDER BY Album.AlbumName
14. Click the OK button to insert the query into the page.
You have created a query that includes all the information from the Album and Artist
tables and joins them so that where the ID of the Artist is the same in both tables that data
is related. That is sort of confusing, but we are going to see how that is used in the next
steps.
Note: If you want a great resource on SQL, try Sams Teach Yourself SQL in 10
Minutes by Ben Forta.
Now that you have the recordset in the page, you can access it in a number of ways. Last
recordset you accessed the data directly and put it in the page. This time you are going to
create an entire table of all the albums at one time and you will create a detail page at the
same time using an application object so you can click on an entry and go to a detail
page.
1. Click in the Main Area Content editable area and delete the content. Leave the
cursor in the editable area.

2. Select Insert > Application Objects > Master Detail Page Set.
Fill out the Master Detail Page Set dialog as follows:

3. Select the recordset that you want to pull the data from.
4. You have a lot more fields in the Master Page Fields than you want to appear in
the master page. To remove fields, select them and click the "-" key to remove
them. The point of the master page, remember, is to give enough information to
your user to make a choice, but not to provide so much that you are going to
overwhelm them.
When you are done deleting the fields, you don't need you can re arrange them in
the list. That controls their position in the table that is generated. Doing the work
here is a lot easier than doing it after you have inserted the table into the page.
Use the up and down arrows to move selected fields up and down in the list.
Work on those fields till you get to what you see in this illustration.
5. The Link To Detail From pop up menu lets you select which field in the table is
going to be the link to the detail page from the master page. Select AlbumName
from the pop up menu.

6. The Pass the Unique Key field tells you which information to pass to the detail
page so that the detail page knows which record to show.
7. Set the Show radio button to All Records. When you get many records in a
database, you may want to limit the number of items shown on a page. Depending
on how many records you are returning, however, you may not want to break the
returned items into multiple pages.
Note: If you break your master page into multiple record sets, you make that page
very difficult to print and to save for your customer. You want to balance the size
and usability of your page with the ability to access your information off line. If
you go to a site with a list of 30 or 40 used cars, you probably want to be able to
see them all next to one another. If you break those up to three or four screens,
you make that difficult or impossible.
Below the dividing line, you are working with the detail page and not the master page. In
the detail page, you need to set the name for the detail page and to select the fields that
you want to have in the detail page.
1. In the Detail Page Name box, enter the name of the page you are going to create.
In this case, name it albumdetail.
2. As you edited the Master Page Fields, edit the Detail Page Fields. Delete all but
the following and then arrange them in this order: AlbumName, AlbumPrice,
AlbumCatalogNumber, AlbumNotes, ArtistGroupName, ArtistStyle,
ArtistNames, and ArtistPhoto.
The order you select the fields here, determines how they appear in the detail
page.
3. Click OK
You should see a table inserted into your page with all the data in the database in each
record if you are in the dynamic data view and have the auto refresh checked. If you
don't, you need to go into the dynamic data view and you should see this table inserted.
There is also a new document in your workspace called albumdetail.cfm. Save that new
page that was created as albumdetail.cfm> You will need it in a little while.

There is a lot that you want to do to this table to make it look really excellent. You are
going to do that now.
1. In the first row of your table, select each column name and replace it with
something more readable, except for the first heading. You are not going to need
to have anything there at all, so delete that one.
2. Select all the cells of the first row and set them to bold so that they stand out.
3. You don't need the "2 Records Total" visible at the bottom, so delete that now.
4. While the borders are great when you are setting a table up, they have to go
visually. Select the table in the tag inspector at the bottom of the document
window. You will get the Table Property Inspector up. In the inspector:
o set the cell padding to 2
o set the border to 0
o set the width to 100% because you want the table to fill the entire space
allotted in the template
o change the alignment to left so that it locks it in relation to the news
sidebar on the left.
Now that the table is well formatted, you need to make the last change on the table. You
are going to display a thumbnail of the album in the first column so the user gets an idea
of which album they are getting information on. Also, it adds some small color to the
page. Each thumbnail is only couple of K, but when you do things like this, you do want
to be aware of how heavy that may make your page. If you can compress the thumbnails
more, that is a great idea. But, if you still have too many, you may want to consider
setting the master page to only display 15-20 records at a time so that a limited number of
the thumbnails are downloaded at a time.
1. Click on the "assets/bands/YL_hyst_thumbnail.jpg" placeholder and delete it.
If you have live data turned on, the other thumbnails disappear as well.

2. Click your cursor in the cell where the placeholder was and insert an image.
3. In the Insert Image dialog at the top, there is a radio button to select to insert from
the file system or from the data sources you have set up for your site. Click on
Data Sources.
4. Expand the Catalog datasource and you will see the same list of fields that you do
in the Bindings panel.
Select AlbumCoverThumbnailURL from the list and click OK.
You should see the thumbnails in the first columns of the table.
5. Save your file.
You have created the catalog page for Record Store. Now you want to work on the detail
page that you created when you inserted the Master Detail Page Set.

Modifying the albumdetail page

1. Open the albumdetail.cfm page if you don't have it open already.

2.
3.

4.
5.

This is one ugly page. You need to get it to match the catalog page and that is
going to be really easy.
Open the Assets panel. If you don't see the Assets panel it is grouped with the Site
panel by default. If you need to, you can go to the Window Menu and select
Assets.
In the Assets panel, click on the icon second from the bottom. If you leave your
cursor over the image, you should see a tool tip identifying it as Templates. Last
time you used a template, you did it from the New File Dialog. This time you are
going to apply an existing template to an existing page.
Highlight the icon for the recordstore_template and click the Apply button at the
bottom of the panel.
The Inconsistent Region Names dialog box comes up.
This is how you can select areas of your page to flow into a specific area of a
template. This is really useful if you are going to apply templates to documents
that were built with other templates where the names of the editable regions are
not the same.

6. For the Document body of the albumdetail.cfm page, click on the Move Content
to New Region dropdown and select Main Area Content and click OK.
7. Save your page.
Your document should look like this now.

You can use some of the things you tried in previous steps to make this page look better.
You do not need to do anything at this point. This section is optional.
Some of the optional things you might try on your own include:

Deleting the title from the Title Bar Sidebar editable area.
Dragging the name of the album from the Bindings panel to the Title Bar Main
Area.
Adding an image in the Sidebar Content and bind that to the AlbumCoverURL
from the data source that was automatically inserted in the page when it was
created by the Master Detail Page Set behavior.
Selecting rows in the table and cut and paste them to put the table into the order
you want.
Modifying the attributes of the table any way you like.
Adding an image in the table to show a photo of the artist.
Changing the format of the price placeholder to currency dollar format in the
Binding panel.

You are ready to test the customer-facing portion of your site.

1. Open your catalog.cfm page and press F12 or open a browser and browse to the
file.
(A common URL to the file is
http://localhost:8500/RecordStoreCFStart/catalog.cfm.)
2. Click on the name of one of the albums and you should go to the detail page.
You now have a simple application formatted in the corporate templates.

Creating the administrative site

Creating a customer-facing site is important and not too difficult, but what do you do to
add records to the database? For example, when there is a price increase how do you
change that? If a band's album stops selling, what do you do to take it out of your catalog.
If you were doing your site as static pages, you could hire a production artist or modify
all the pages that use that information yourself every time.
Neither is a good option.
What you want to do is create a was to access the data on your site from behind your
firewall that accesses the same database. Or, you need to create a private passwordprotected part of the site that you can use to administer the data through a browser. Since
creating a password-protected site is beyond the scope of what you are going to learn
here, you are going to create a new set of pages in the same site that will allow you to
change the data in the database. In the real world, you would never externally publish
pages that would allow someone to administer the site. This example is for you to learn
how to make pages to edit, add and delete data.

Creating the admincatalog page

Since you need to be able to see the data much the same way as the end user of the site, a
great place to start your admin site is copy the catalog.cfm page and save it as
admincatalog.cfm.

1. Open the catalog.cfm file and select Menu -> Save As and save the file as
admincatalog.cfm.
2. Put your cursor in the price column and right click to get the context menu.
3. From the context menu, select Table -> Insert Rows or Columns and insert one
column after the current column.
4. Put your cursor in the new last cell in the second row after the price for the first
album. Type "edit".
5. Select the word "edit" that you just added in the table and in the property
inspector click on the folder icon at the end of the Link dropdown.
6. In the File Name of the Link dialog type "adminedit.cfm". You are going to create
that file in a minute but it does not exist now.
7. Click on the Parameters button and type "AlbumID" in the name and then tab to
the value field. Instead of typing in a value, click on the lightning bolt icon and
click on the "AlbumID" in the recordset that comes up.
Here, you are setting the link to pass the AlbumID, the unique key for the table is
passed in the URL string to the adminedit.cfm page where there will be a
recordset to catch the AdminID and show just that data that matches that record.
This is very much what the Master Detail Page Set behavior does automatically,
but this time you are going to have to do it by hand.
8. Click OK to set the link. You should see
"adminedit.cfm?AlbumID=#Catalog.AlbumID#" in the Link dropdown in the
property inspector.
9. Save your page.

Creating the edit record page

Now that you have the admincatalog.cfm built, you need to create the adminedit.cfm
page.
1. Create a new page and apply the recordstore_template to the page.
2. Insert a Query from the Bindings panel. Select the Advanced dialog and either
type or use the interface to create the following query:
SELECT *
FROM Album, Artist
WHERE Album.ArtistID = Artist.ArtistID
AND Album.AlbumID = #AlbumID#
This query selects all the data from two tables, Album and Artist. It joins the two
tables on the ArtistID field. What is new here is that there is an addition of one
more condition to the WHERE statement. The "AND Album.AlbumID =
#AlbumID#" tells the database to only find records where the value of the
AlbumID field in the Album table is the same as the value passed in from the

URL that you just added to the admincatalog.cfm file.

3. Name your query AlbumQuery.
4. Insert a second query, name it ArtistQuery, and add the following SQL statement.
SELECT *
FROM Artist
You are going to use this to populate a pop up menu.
For more detail on creating queries, you should look at the ColdFusion
documentation that installs with your ColdFusion MX server.
5. Click in the Main Area Content Area and delete the placeholder text and select
Insert > Application Objects > Record Update Form.

6. Fill out the form with the following choices:

7. Select the RecordStoreCF data source for the Data Source.

You will get a warning at this point that there are some fields in the database that
may cause some issues. Ignore the message as the fields you edit won't run into
any problems.
8. Select Album from the Table pop up menu.
9. Set Select Record From to AlbumQuery. This is the recordset that you created.
10. Select the Unique Key Column to be AlbumID.
11. Set the After Updating, Go to equal to admincatalog.cfm so that you can see the
changes you made.
12. Below the line, delete the fields until you have only the following fields left:
AlbumName, ArtistID, AlbumPrice, AlbumNotes, and AlbumCatalogNumber.
You don't want to insert the AlbumID, because that is automatically generated
and will exist for the record and you don't want to change that. You could also
leave the URL fields in, but not for this example.

13. Select the ArtistID form field in the Form Field table. You are going to change
this so that it displays as a menu and not as a text area.
14. Click on the Display As: dropdown and select Menu.
15. Click on the Menu Properties... button.

16. Select to populate the menu items from a database and select the ArtistQuery as
the recordset that you set up when you started this page. You want to select that
one because you want to get all the names for all the bands in the pop up menu,
not just the name of the selected band. It would be useless to have a pop up menu
with only one choice.
17. Set Get Labels From to ArtistGroupName.
18. Set Get Values from ArtistID.
19. Set Select Value Equal To equal to #AlbumQuery.ArtistID#. This makes the
default, or selected entry in the dropdown the name of the selected band.
20. Click OK.
21. Click OK again to OK the Record Update Form.
22. Save your file.
You can use any of the techniques we used previously to improve the layout of the page.
One thing that I recommend is that if you are creating a page that is going to insert or
change data of a record, is to put some instructions on the page so that you remind
whoever is working on that page to edit carefully, since they are working with live data.
Your page might look like this:

Test your application by opening the admincatalog.cfm and previewing it in your browser
or by browsing to it from your testing server. Click on the edit button for one of the
albums and edit a few of the properties and then click Update Record. You will go back
to the admincatalog page and your changes that you just made will show up.

Creating the insert record page

Creating an insert page is even easier than the edit page. You will start with the
admincatalog page and add a button there to add a record and then a page to add the
record.
1. Open the admincatalog.cfm page if it is not already open.
2. Select the contents of the Sidebar Content and delete it.
3. Add an image and navigate to assets/b_addrecord.gif and click OK to insert the
graphic.
4. In the link box of the image you just inserted, link to adminadd.cfm which you are
going to create in a moment.
5. Save the file.
Now that you have a link from the admincatalog.cfm page, you can create the add page
itself.
1. Create a new page from your template and save it as adminadd.cfm.

2. Create two recordsets. Name one AlbumQuery and select everything from the
Album table. Name the second one ArtistQuery and select everything from the
Artist table.
3. Click in the Main Area Content and delete the placeholder text.
4. Select Insert -> Application Objects -> Record Insertion Form.
Fill out the form with the following choices. This is much the same as the Record
Update form.

5. Set the Data Source to RecordStoreCFStart, Set the table to Album, After
inserting you want to go to the admincatalog.cfm.
6. In the Form fields you want to leave them all there except the AlbumID, which
the database is going to assign automatically.
7. For the ArtistID, set it to Menu and then click on the Menu Properties... button.
8. Set Get Labels From to ArtistGroupName.
9. Set Get Values from ArtistID.
10. Leave Select Value Equal To empty because there is no data being handed to the
form to display.
11. Click OK.
12. Click OK again to set the Record Insertion Form.

13. Save the file.

You now have a complete application for the most part where your customer can view
data from the database and can go to detail records for each piece of data. You can
administer and change the data for each record in the database and you can add more
records to the data base. You have leaned how to use templates with dynamic data, bind
tables to one another, how to use the Application Objects, and how to use one recordset
with another to select data to display in a form that updates another recordset.

Extra credit
Where should you go from here?
Well, there are few things that are missing from this application. You can't delete a
record, and there is no password protection for the admin part of the site.
You will notice if you look at the Application Objects that there is no delete record
object. Basically, that is because deleting records from a database is a bad idea in most
cases. Best practice for databases is to use a Yes/No or Boolean field in your databases to
determine which records are inactive. Then, in every recordset you make, you set a
WHERE condition in the SQL to only show the active records. That way, when you
make a record inactive, it is there in the database for you to access if there was some
mistake. But, it will not show up anywhere that you don't want it to. You can do that with
this example. The Album table has a column in it for this purpose. Try to make that work,
and remember to change your queries to have a WHERE condition to show only the
active records.
You also didn't create password authentication in this tutorial. There are many techniques
for creating password authentication. You may want to check the Macromedia Exchange
for extensions that add this ability.

Additional reading and resources

There are loads of resources for you to tackle to help you learning Dreamweaver and
ColdFusion MX.
There are constantly new tutorials, tips and articles for Macromedia products that are
published in the Macromedia Designer Developer Center.
Another great place to go for information and help is the Macromedia Forums where
there are lively discussions of all our products.
There are lists of ColdFusion MX resources and Dreamweaver MX resources at the
Macromedia support center. Check out
http://www.macromedia.com/support/dreamweaver and
http://www.macromedia.com/support/coldfusion
You can also see this application working at
http://examples.macromedia.com/dreamweaver/recordstore/catalog.cfm
This tutorial is being written before the release of many of the books on Dreamweaver
MX, but you can always go to your favorite bookseller and search for ColdFusion MX

and Dreamweaver MX. Amazon.com has a Macromedia bookstore where you can find
many of the latest publication about Macromedia products.