close ad
Databridge V2 with MySQLi support IS Now Available!
open ad
View Menu

Web development tutorial

Repeating Tables server behavior

Tutorial created by Ray Borduin, WebAssist

Categories: Data Bridge


Sometimes you just have to show off what you have. Most often, for us computer folks, all we really have is database tables filled with raw data. Fortunately though, Data Bridge makes it easy to flaunt that data to the world with the beauty known as Repeating Tables.

In this tutorial, we're going cover the basic process of applying Repeating Tables to a page, so we can let everyone see just how great our data is.

We will be using the WebAssist classic Blue Sky Music database for this tutorial, but if you happen to have existing databases ready for use, feel free to plug in your database information in the place of the Blue Sky Music information.

arrow downWhat you need to start:

  1. A dynamic site set up within Dreamweaver
  2. A blank database
  3. Dreamweaver CS3 or later
  4. Data Bridge installed and activated in Dreamweaver
  5. The Blue Sky Music database files, which can be downloaded here

arrow downConfigure the Database

For those of you that don't have immediate access to a database filled with data, we're going to use the Blue Sky Music database. This will give us tables filled with data that can easily be used for Repeating Tables.

  1. Download the Blue Sky Music zip file.
  2. Extract the files to an easily accessable directory.
  3. Open your MySQL database manager.
  4. If your manager has an Import feature, use that with the blue_sky_music.sql file and skip to the last step. Otherwise, continue with the following steps.
  5. Open the blue_sky_music.sql file.
  6. Copy the contents of the file.
  7. In your blank database, run the Blue Sky Music SQL query.
  8. Create a Connection in your Dreamweaver site to the newly populated database. For this tutorial, we'll name it 'blue_sky'.

arrow downCreate a Recordset

Now that we have the database, we're going to need a page with a recordset on it to pull the data from the database to display. For this example we're using the items demo data that's populated with several albums and their details.

  1. Create a new PHP page in Dreamweaver called itemlist.php
  2. In the menu bar, click Window > Bindings.
  3. In the Bindings Window, click the Add Binding ( ) button.
  4. Select Recordset (Query).
  5. Make sure the Recordset dialog is set to Advanced mode by clicking the 'Advanced...' button.
  6. Enter 'rsItems' as the name of the Recordset.
  7. Make sure the correct connection (e.g. blue_sky) is selected.
  8. This will populate the Database items box with everything in your database.
  9. Expand the Tables list.
  10. Select 'items' from the expanded tables.
  11. Click the SELECT button.
  12. This will add the following SQL query to the SQL box, which pulls all available items from the item list in the database:
    SELECT *
    FROM items

  13. Click the OK button to add the Recordset to your page.
  14. Save your page.

Now we're pulling all the data from the items table in the database.

arrow downAdd some style to the page

We need to add some basic styles to the page to help you see how Repeating Tables is working once we have it up and running. These will add different background colors to the even and odd rows once the data is being displayed.

  1. Add a style to the page. You can enter it manually by pasting the following code into the <head> section of your site's source:
    <style type="text/css">

  2. Now that we have the style, add a class selector for the class even within the style tags.
  3. This will make all rows on the page with the class even have a background color of #cccccc
    .even {
    background-color: #cccccc;

  4. Now we're going to do the same thing, but with a class selector for the class odd.
  5. Again, this is to give all rows on the page with the odd class a background of #999999
    .odd {
    background-color: #999999;

  6. Save the page

Now we can tell which rows are which.

arrow downApply Repeating Tables

Now that you have the records your Repeating Tables business is going to be pulling its information from, and the styles to make your page beautiful, you're going to need to actually apply the Repeating Tables Server Behavior to your page.

  1. Click WebAssist > Database > Repeating Table.
  2. Make sure your recordset is selected in the Recordset drop down.
  3. Set the Rows drop down to 'All records'.
  4. This will display as many rows as needed to show all of your data.
  5. Set the Columns to 5.
    This will display 5 columns worth of data before dropping down to the next row
  6. Select the 'even' style from the Even row style drop down.
  7. Select the 'odd style' from the Odd row style drop down.
  8. Click the 'None' option under the Header.
  9. Click OK.
  10. Save your page.

You can now see the Repeated Table added to the page with the text "Your Repeated Content". It only looks like one table cell, but it will be repeated for each element in the database.

arrow downAdd content to be repeated

Our last step is to add the content we want shown to the repeated table cell in the form of a recordset binding.

  1. Select the text [Your Repeated Content]
  2. In the Bindings Panel, expand the recordset we created earlier
  3. Click on the ItemName binding
  4. Drag the binding over the selected [Your Repeated Content] text
  5. This will replace the selected text with the binding
  6. Save your page

Voil?! You've now created a table that repeats as many cell as needed to display all the entries in your recordset binding. You should preview the page and make sure everything worked, then bask in your own glory. You've earned it.

arrow downWhat to do next...

I've been watching you, and I see that you're getting pretty darn good at this web development stuff. You should sharpen your skills even more. Maybe add additional styling to the displayed rows, or add a nice header to your table. The sky is the limit now that you know Repeating Tables! ... Well, the sky being anything related to Repeating Tables, but you catch my drift.

arrow downReviews and comments

Comments will be sent to the author of this tutorial and may not be answered immediately. For general help from WebAssist, please visit technical support.

Sign in to add comments

donald.dickson338135: 7 Years, 1 Month, 5 Days, 15 Hours, 46 Minutes ago

The Blue Sky Music database files link does not find the zip file to download - have searched the site but cannot locate this file

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question





Ease of use


security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.