Creating a Dynamic Web Page Application Using Dreamweaver MX

happylandcannedSoftware and s/w Development

Jul 2, 2012 (5 years and 4 months ago)

248 views

Creating a Dynamic Web Page Application Using Dreamweaver MX

1. Click the “Start” button, followed by “All Programs”, followed by “Macromedia,
followed by “Macromedia Dreamweaver MX”.
2.Click “File” followed by “New…”
3.Select the “General” tab under the “New Document” window and select “Dynamic
Page” from the “Category” listings. Select “ColdFusion” under the “Dynamic
Page:” listings. Click on the “Create” button.
4.Click “File” followed by “Save As…”
5.In the “Save As” dialog window select the folder path
“C:\Inetpub\wwwroot\plcdynamicweb” by clicking on the down arrow followed by
a double click on the “C:” drive icon, followed by a double click on the “Inetpub”
folder, followed by a double click on the “wwwroot” folder, followed by a double
click on the “plcdynamicweb” folder. Type “index.cfm” in the “File name:” textbox
and click on the “Save” button.
6.Click on the “Application” Panel Group followed by the “Databases” tab. You
should see a message that reads: “Create a site for this file.”
7.Click on the hypertext link (the word “site” in #1 of above graphic).
8.Type in “PLC Dynamic Web” in the textbox which reads: “What would you like to
name your site?”
9.Click on the “Next” button.
10.Click on the “Next” button of the “Editing Files, Part 2” window. Note: ColdFusion
should already be selected as the server technology.
11.Type “C:\Inetpub\wwwroot\plcdynamicweb” in the textbox that reads: “Where on
your computer do you want to store your files?” of the “Editing Files, Part 3”
window. Note: You must type the above mentioned path in the quotations exactly
as it appears!
12.Click on the “Next” button.
13.Click on the “Test URL” button to make sure everything is working properly. If
successful, you should get a pop up message that reads “The URL Prefix test
was successful.” Click the “OK” button.
14.Click the “Next” button.
15.Click the “Next” button. Note: The “No” radio button should be highlighted when
asked if you want to move the file to another machine.
16.Click on the “Done” button on the “Summary” window.
17.You should now see checkmarks beside items 1-3 under the “Databases” tab of
the “Application” Panel Group.
18.Click on the hypertext link labeled “RDS login” in item #4.
19.Type in the password that you specified when setting up your ColdFusion MX
server in the “Password” textbox and click the “OK” button.
20.Click on the “Binding” tab under the “Application” Panel Group.
21.Click on the “+” icon button.
22.Click on “Recordset (Query)” from the drop down list.
23.In the “Name:” textbox of the “Recordset” window, type: “ShowNames”.
24.Select “PLCDynamicWeb” from the drop down list. You should see “Students”
coming up under the “Table:” heading.
25.Click on the “Test” button to test your database connection. You should see the
contents of the Microsoft Access database that you created earlier. Click on the
“OK” button of the “Test SQL Statement” window.
26.Click on the “OK” button of the “Recordset” window.
27.Click anywhere in the white work area of Dreamweaver MX and type “My First
Dynamic Web Application”.
28.Click in the “Title:” textbox and type “Dynamic Web Application”.
29.Click anywhere in the white work area of Dreamweaver MX and using your
mouse, highlight the text passage that you typed: “My First Dynamic Web
Application”.
30.Click on “Text” on the pull down menu followed by “Align” followed by “Center”.
Press your “Enter” key a couple of times to move the cursor down the web page.
31.Click on the “Tables” tab under the “Insert” Panel Group.
32.Click on the “Insert Table” icon. When the “Insert Table” window appears enter
“2” for the number of “Rows:”, “6” for the number of “Columns:”, “1” for the
“Border:”, and “1” for “Cell Padding:”. Click the “OK” button.
33.Starting at Column 1, Row 1, enter the following column headings: “First Name”,
“Last Name”, “Student ID”, “Grade”, “Date of Birth” and “Gender”.
34.Click on the “+” icon button beside the “Recordset” icon under the “Bindings” tab
of the “Application” Panel Group.
35.Click on the “lightning bolt” icon to the left hand side of the “FirstName” fieldname
and drag it to the bottom left hand corner of the table. Release your left mouse
button when it is over top of the bottom left hand cell. Repeat the steps above for
the remaining five fieldnames. You want to match each fieldname to its
respective column. Note: You may need to use your horizontal scroll bar at the
bottom of your work space in order to view the last couple of columns in your
table.
36.Move your horizontal scroll bar at the bottom of your work area all the way to the
left so that you can see the bottom left hand cell in your table. Click on the
bottom left hand cell border of the bottom row to select all of the cells in the
bottom row of the table. Note: Your cursor icon should change from an “I bar”
icon to a “right hand pointing arrow” icon when you move the cursor over the cell
border.
37.Click on the “Server Behaviors” tab of the “Application” Panel Group and click on
the “+” icon button. Select “Repeat Region” from the drop down list.
38. You should see a “Repeat Region” window appear with your “ShowNames”
recordset appearing. Click on the “OK” button.
39.Click “File” followed by “Save”.
Congratulations! You have just created your first dynamic web page application.
Let’s have a look at your newly created dynamic web page application.
40.Start up your favourite web browser and type in the following URL address in the
“Address” or “Location” area: “http://127.0.0.1/plcdynamicweb”. Note: You could
also type in: “http://localhost/plcdynamicweb” and get the same results.