22.3 Displaying Multiple Records

Often, you'll want to create a Web page that displays multiple records, such as a page that lists all of the products in your company's catalog.

So far, you've learned how to insert dynamic data only from a single record. Fortunately, Dreamweaver provides two tools for displaying multiple records: the Dynamic Table and Repeat Region objects.

22.3.1 Creating a Repeating Table

HTML tables (see Chapter 6) were initially created to display data. The columns and rows of tables provide tidy compartments for individual pieces of information. It's not surprising, then, that in database terminology, row often refers to a single record in a database, and column indicates a single piece of information in a record.

Dreamweaver's Dynamic Table tool lets you display the results of a recordset in an HTML table. The top row of the table includes the name of each database column to identify the data in the rows below. The bottom row includes dynamic data—one database column per table cell (Figure 22-10).

Although the Dynamic Table tool creates a table that displays multiple records, you only see one table row's worth of dynamic data. The Repeat tab that appears above the row indicates that this row will repeat, once for each record in the recordset. To see the effect, use Live Data view (see Figure 22-14).

The magic of this tool is that it can duplicate the bottom row for each record in the recordset. In other words, the table will display multiple records, one per table row. Here's how to use it:

Create a recordset (Section 22.1.2). In the Application tab of the Insert bar, select Dynamic Table from the Dynamic Data button menu (see Figure 22-6).

The Dynamic Table tool lets you quickly create a table to display all or some of the records in a recordset. This easy-touse tool isn't available if you're using either of the ASP.NET server models. Instead, you use an ASP.NET datagrid—a more complex, but more versatile tool. For more information check out www.macromedia.com/devnet/mx/dreamweaver/articles/data_grids.html.

You can also choose InsertApplication ObjectsDynamic DataDynamic Table. Either way, the Dynamic Table window opens (see Figure 22-11).
From the Recordset menu, choose the recordset you'd like to use.
Since a page can contain more than one recordset, you have to indicate which records you want to display.
Using the Show radio buttons, specify the number of records you wish to display.
You can show all of the records on a single page by clicking the All Records button. However, if your recordset is huge—if your company has 10,000 employees, say—a single page with all of that information could be very large and difficult to navigate. In this case, you should display only a handful of items at a time.
If you type 10 in this box, you'll see at most ten records when previewing the page. (If you choose this method, make sure to add a Recordset Navigation bar, as described in Section 22.4, to let visitors page through the list of results.)
Set the Border, Cell Padding, and Cell Spacing values for the table.
These HTML table properties are described in Section 7.6. All you're creating here is a plain old HTML table. You can dress it up later in Design view by changing the border, cell padding, cell spacing, background cell color, and other table properties.
Click OK.
Dreamweaver inserts a table into the page. The top row contains the names of each column from the recordset—one name per table cell. You can, and probably should, edit these names to make them more understandable. After all, prodNameprodID, prodName, and prodPrice may not mean anything to your visitors.
The bottom row of the table contains the dynamic data from the recordset and represents one record. The table row has a Repeat Region object applied to it, which you can edit or delete as described in the next section.

22.3.2 Creating a Repeat Region

While the Repeating Table is easy to use, it doesn't provide the flexibility you might require. For example, what if your dynamic information was presented in a bulleted list (one record per bulleted item) or in individual paragraphs (one paragraph per record)? In these cases, you must create a repeating region—a chunk of HTML that repeats once for each record in a recordset.

Here's an example that can help you understand how to use the Repeat Region object. Imagine you're creating a page to list your company's staff directory. This page would include the name, telephone number, email address, and department of each employee. Of course, all of this information is stored in a table in a database—one column for each piece of information, and one record for each employee.

In Dreamweaver, you create the basic design of the page, and then add a recordset that retrieves the required information about each employee in the company. The page layout presents each employee's information in a single paragraph, so the finalized page has many paragraphs—one for each employee.

Since this is a dynamic page, you can't predict how many paragraphs will be needed. After all, your company may hire many new employees, which would add records to the database. To allow for this uncertainty, create a single paragraph by adding the dynamic information you want in it, following the steps in Section 22.2. Then tell Dreamweaver to repeat that paragraph using information from each record retrieved by the recordset.

Just follow these steps:

Using the Bindings panel or one of the techniques described in Section 22.2, insert dynamic text onto the page.
You should put these items together on the page, maybe in a single paragraph or in a bulleted or numbered list. Select the dynamic text and any HTML code you wish to repeat.
For example, select the paragraph (click the <p> in the document window's tag selector) containing the dynamic data. If you're using a bulleted list to present this information, select the list item (<li> tag) containing the dynamic data. For data in a table row, select the table row (<tr> tag).
In the Application tab of the Insert bar, click the Repeat Region button (see Figure 22-1).
You can also choose InsertApplication ObjectsRepeated Region. Either way, the Repeat Region window appears (Figure 22-12).

In a Repeat Region that reveals only a limited number of records at a time (in this case, ten), add a Recordset Navigation bar (see Section 22.4). Otherwise, visitors to the page will see the first ten records of a recordset, but will have no way to view additional records.

From the Recordset menu, choose the recordset you want the page to work with.
Since it's possible to have more than one recordset per page, be sure to select the recordset whose data is included in the area you are going to repeat.
Choose the number of records you wish to display.
If you decide not to use the "All" option, make sure that you add a Recordset Navigation bar, as described in Section 22.4, to let visitors page through the list of results.
Click OK.
Dreamweaver adds the proper programming code to the Web page.

22.3.3 Editing and Removing a Repeat Region

If you selected the wrong recordset, or you want to increase the number of records displayed at a time, you can easily change a repeating region. Simply open the Server Behaviors panel (Ctrl+F9 or WindowServer Behaviors) and double-click Repeat Region from the list. In the Repeat Region window (Figure 22-12), make any changes and click OK.

To remove a Repeat Region, open the Server Behaviors panel. Select Repeat Region from the list and click the —button (or press the Delete key.)

< Day Day Up >