Creating Dynamic Pages


Now that you know how to extract data from the database, you're ready to start building dynamic pages. Although there are endless uses to how you can use dynamic data, five page types are typically used across dynamic web sites:

  • Results Page Displays a list of records in the database that match certain criteria and typically links to a Details page.

  • Details Page Displays information pertaining to a specific record in the database.

  • Insert Record Page Inserts data into a new record in the database.

  • Update Page Updates an existing record in the database.

  • Delete Page Deletes a record from the database.

Results Page

After the recordset has been tested, it's likely that you'll want to display the results somewhere. The easiest way to do this is to create a Results page that displays the contents of the recordset in a table. The easiest way to display the data is to create a dynamic data table that extracts the information from the recordset and displays it on the page.

To create a dynamic data table, click Insert, Application Objects, Dynamic Data from the menu bar. In the Dynamic Table dialog box, shown in Figure 29.20, choose the appropriate recordset and determine how many records should be displayed on the page at a time. For this example, we show 10 records at a time. You can also specify table settings by entering a value for the border, cell padding, and cell spacing.

Figure 29.20. The Dynamic Table dialog box helps you extract data from your recordset to display on your page.


Clicking OK places a table in the page, complete with data bindings (see Figure 29.21). Note that Dreamweaver assumed that you wanted to display all the columns in your recordset, but you can remove any columns that you don't want to display.

Figure 29.21. Dreamweaver adds the dynamic data table to your page.


Because the user probably doesn't want to review every detail of every record that meets the search criteria, you can delete all the columns from the data table except InventoryID, Year, Make, Model, and Color. This should give users enough information to choose which motorcycle they might want to look into further (see Figure 29.22).

Figure 29.22. Columns have been removed from the table to streamline the user's view.


After users determine which motorcycles they want to see more information about, they need to be able to click a link to open the Details page, which then displays the full informational record on that specific motorcycle. To create this link, select the InventoryID data binding and type details.cfm in the Link field of the Property inspector.

Next, you need to pass the InventoryID field through the URL so that the Details page will know which record to display. To set this up, click the folder icon next to the Link field in the Property inspector and click the Parameters button. In the Parameters dialog box, shown in Figure 29.23, type InventoryID as the name for the parameter.

Figure 29.23. The Parameters dialog box enables you to pass custom parameters through the querystring.


Next, click the lightning bolt icon next to the Value field and choose inventoryid from the list of data bindings in the rsInventory recordset (see Figure 29.24).

Figure 29.24. Choose the inventoryid to be passed as the value.


Click OK to close the Dynamic Data dialog box, click OK again to close the Parameters dialog box, and click OK a third time to close the Select File dialog box. After it is created, the inventoryid now becomes a hyperlink that, when clicked, passes the inventoryid of that specific record to the details.cfm page.

Details Page

A Details page usually contains the information stored in the database that relates to a specific record. This page enables users to get detailed information about an item after they have determined from the Results page that it might meet their needs.

In the case of Retro's Cycles, clicking the link on the Results page passes an inventoryid to the Details page, so you need to build a Details page that reads that value, extracts the appropriate record from the database, and displays it on the page. To do this, you need to create a new page and save it as details.cfm.

Next, a recordset needs to be built that looks for the URL parameter called inventoryid and finds the record whose inventoryid matches that value. The recordset would look like the one shown in Figure 29.25.

Figure 29.25. The Details page recordset.


After the details recordset is completed, you can construct the page however you want to display the full details of a specific motorcycle. Figure 29.26 shows a sample configuration of the data bindings.

Figure 29.26. A sample Details page.


Insert Record Page

Because the database for the Retro's Cycles site already had data stored in it, recordsets and data bindings could be used to extract information from it. But what if the database is empty and you need to populate it with data? Or what if we wanted to add additional records beyond those that are already stored in the database? The answer is to create a page that inserts new records into the database. Dreamweaver makes the creation of an insert page easy through the use of the Record Insertion Form Wizard.

To activate the wizard, choose Insert, Application Objects, Insert Record, Record Insertion Form Wizard. The wizard, shown in Figure 29.27, enables you to specify the data source that connects to the database, any username/password information required, the table to which you want to add, and a page to which the user is redirected after the record is added.

Figure 29.27. The Record Insertion Form dialog box enables you to add a form to your page that inserts data into the database.


The really nice thing about this wizard is that it lets you set up your form and the form elements in one handy interface. For instance, suppose that you wanted the year field to be a menu instead of a text field. You could select the year field in the Form Fields panel and choose Menu in the Display As field (see Figure 29.28).

Figure 29.28. The year form field has been changed to a menu item.


To give users values from which to choose in the menu, click the Menu Properties button to add the various years and values (see Figure 29.29).

Figure 29.29. Custom values can be added to the menu.


When the OK button is clicked, Dreamweaver does all the work and adds the records insertion form to your page (see Figure 29.30). You can then customize the form and the table layout to match your site's design.

Figure 29.30. The record insertion form is added to the page.


Update Record Page

Updating information that is stored in the database is nearly as easy as inserting it. To update a record, you can create a page similar to the page that adds a record. The update page, however, requires a recordset that determines which records to update, and the existing data that matches that record is displayed in an editable form. Upon submission of the form, the content stored in the form replaces the content stored in the database record.

Note

The earlier Results page linked to a Details page and passed a URL parameter to indicate which record should be displayed in the Details page. Here, as well, a Results page needs to be created (or some other clickable link) that passes the variable to the update page, which indicates to the recordset which specific records should be edited.


To accommodate the creation of an update page, Dreamweaver has added another handy wizard called the Record Update Form Wizard, which you can access by choosing Insert, Application Objects, Update Record, Record Update Form Wizard from the menu bar.

The wizard, shown in Figure 29.31, is very similar to the Record Insertion Form Wizard and enables you to customize the form to meet your needs. This wizard does, however, have one additional field named Unique Key Column, which indicates which field in the database serves as the primary key and ensures that the record is unique.

Figure 29.31. The Record Update Form Wizard helps you create a page that makes updates to existing records.


In the case of the tbInventory table, the autonumber inventoryid field serves this purpose, and choosing this field ensures that the form makes the update to the correct field.

After the wizard is completed, the table and editable fields are added to the page and are customizable to meet your page's design.

Delete Record Page

The last of the common dynamic page types is the oh-so-dangerous Delete Record page. This page enables you to permanently remove a record from your database. Did I mention that the deletion of the record is permanent? If I didn't mention that, let me state clearly that the deletion of the data done with a Delete Record form is permanent. If it sounds like I'm beating a dead horse, it's because on numerous occasions I have heard the question "Can you get that back for me?" after a user deleted a record from the database. Although the Delete Record page can certainly be a valuable tool in the right hands, it can be just as dangerous in the wrong hands.

Unlike the Update Record page, this page type doesn't rely on a recordset to identify which record should be deleted. Instead, the page traditionally accepts a variable via the URL or from a form that indicates the unique record ID that should be deleted. Then, when the page is loaded, the record with the corresponding record ID is deleted from the database.

To create a Delete Record page, simply create a new dynamic page and then apply the Delete Record Application behavior by choosing Insert, Application Objects, Delete Record from the menu bar. The Delete Record dialog box (see Figure 29.32) then asks you to specify the data source, authentication information, table, primary key column, and the source of the record ID that matches the primary key. In addition, you need to specify where the user should be redirected to after the record is successfully deleted.

Figure 29.32. The Delete Record dialog box helps you create pages that remove data from your database.


Before you venture out into the world with your new found dynamic tools, let me suggest that you take a moment to read the Best Practices section of this chapter. As you have already probably guessed, I am not a huge proponent of putting delete capabilities into the hands of end users, so I have detailed another option in the Best Practices section.

After you have read that section, go forth, apply your new dynamic data skills, and build powerful, portable, productive websites that knock the socks off your friends and co-workers.



Special Edition Using Macromedia Studio 8
Special Edition Using Macromedia Studio 8
ISBN: 0789733854
EAN: 2147483647
Year: 2003
Pages: 337

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net