Creating a ColdFusion Form using Dreamweaver MX

ballscauliflowerΛογισμικό & κατασκευή λογ/κού

30 Ιουν 2012 (πριν από 5 χρόνια και 6 μήνες)

391 εμφανίσεις

Creating ColdFusion Form Page 1 of 4
Creating a ColdFusion Form using Dreamweaver MX

After ColdFusion Server has been installed and a Dreamweaver Site definition has been created,
you are ready to use ColdFusion Studio which is now part of Dreamweaver MX to create a form.

Create Database

Create or copy a database. If it is a Microsoft Access database, it’s preferred to put all mdb’s
together in a single folder. This example uses: “C:\Databases”.

1. Create a MS Access database named Webmasters.
2. Create a table.
3. Create columns: FirstName, LastName, Employer, & WorkPhone (avoid using spaces
in column names).
4. Save table as Members.
5. Add some data to the table.
6. Save file.
7. Exit MS Access.

Dreamweaver
.
1. Open Dreamweaver
2. File -> New
3. Choose General Tab -> Dynamic Page ->
Coldfusion Or a predefined ColdFusion Template,
Choose Templates Tab -> Your Website -> Select
Template
4. Click the Create Button
5. Under Applications Window, choose the Server
Behaviors Tab/Window.
6. Complete Steps 1-4 (in Server Behaviors
window) if not already done.
7. Choose step 5 (in Server Behaviors window)
“Create a ColdFusion data source.”
a. A Browser will open with the ColdFusion
Administrator Login page.

Browser Window

1. Login to ColdFusion Administrator
2. Type in a meaningful Data Source Name and select the appropriate Driver. We will use
Webmasters and Microsoft Access.
3. Click the ADD button
4. Fill in the Database File text box with the location of the Webmasters.mdb file. Use the
Browse Server button or type C:\databases\Webmasters.mdb
5. Click the SUBMIT button
6. Verify the Status says OK
7. Logout of ColdFusion Administrator
8. Close the browser window.
Creating ColdFusion Form Page 2 of 4
Return to Dreamweaver

1. Under Applications Window, choose the Database
Tab/Window
2. Click the Refresh Button.

3. Under Applications Window, choose the Server
Behaviors Tab/Window
4. Click the Plus Sign

5. Choose Recordset (Query)
6. Name the Query MemberInfo
7. Under Data Source, Choose Webmasters
8. If you have more than one table in your database, choose the appropriate table.
9. Select only the columns needed (Helps with
Performance)
10. Apply any necessary filters
11. Sort records as needed
12. Click OK

Viewing Results on Web Page


For this example, we are going to output the database table
information into a web page table.

Dreamweaver

1. Title the page “MARC Webmasters” (don’t forget the
page title reference).
2. Create a table in the body of the document with two rows and four columns.
3. The first row will be the header row. Highlight these four cells and click on “Header” in
the property window.
4. Label the four columns, First Name, Last Name, Employer, and Phone Number
respectively.
5. Place the cursor in the cell below First Name.
6. Click on the Plus Sign
in the Application Window, Server Behaviors Tab/Window.
(see above diagram)
7. Choose Dynamic Text
8. Expand the RecordSet MemberInfo by clicking the Plus Sign

9. Choose First_Name and click OK
10. Place the cursor in the cell under Last Name and repeat steps 5 – 8 above for Last Name.
11. Place the cursor in the cell under Employer and repeat steps 5 – 8 above for Employer.
12. Place the cursor in the cell under Phone Number and repeat steps 5 – 8 above for Work
Phone.

Creating ColdFusion Form Page 3 of 4
Verify Data Results

1. Check to see if everything is working by clicking on the “Live Data
View” lightning bolt.
2. The first database table row should appear.
3. Click the “Live Data View” button again to remove live data view.

Adding Dynamic Fields to Table

1. Highlight the four Dynamic Text Table cells.
2. Click the Plus Sign
in the Application Window, Server Behaviors Tab/Window
3. Choose Repeat Region
4. Click “All Records” and Click OK
5. Verify Data results (see Verify Data Results above).

Modifying Recordset Query to Include Filters

1. Double-click Edit Recordset (MemberInfo) in the Application Window, Server Behaviors
Tab/Window
2. Change Filter to the following values: LastName, Begins With, Form Variable, and
LastName
3. Click the OK button
4. Notice in the Application Window, Server Behaviors Tab/Window there is now a
CFPARAM (form.LastName) entry.
5. Double-click CFPARAM (form.LastName) in the Application Window, Server
Behaviors Tab/Window to edit the values.
6. Delete the Default value by removing the “1” in the field.
7. Click on the OK button
8. For debugging purposes, verify that the data results are the same as you received before
by selecting the lightning bolt (see Verify Data Results above).

Save File

1. Save the Dreamweaver file as Members.cfm. In this example, save the document to the
C:\Inetpub\wwwroot\OPKansas\_res\Webmasters directory.
2. Close the File.

Create New Dreamweaver Page for Searching Database

1. File -> New
2. Choose General Tab -> Dynamic Page -> Coldfusion
3. Or a predefined ColdFusion Template, Choose Templates Tab -> Your Website -> Select
Template
4. Click the Create Button
5. Title the Page “MARC Webmaster Search” (don’t forget the page reference title).
6. Save the Dreamweaver file as Index.cfm in the same directory as Member.cfm.

Creating a Form

1. Place a Form in the document.
2. In the Properties Windows, change the Action to Members.cfm
3. Type Last Name
Creating ColdFusion Form Page 4 of 4
4. After Last Name, insert a Text Field into the Form
5. Change the Name of the Text Field to LastName. This is the name of the form variable
we used in the CFPARAM (form.LastName) in Members.cfm
6. Insert a Submit button into the form.
7. Save the Dreamweaver file.
8. Close the file.

Testing Page

1. Open a browser and type in the URL address to the Index.cfm page. In my example, this
is http://localhost/_res/Webmasters/Index.cfm

2. Try different letters, partial last names, or entire last names. Don’t forget to try an empty
field.

You Did It!