Build master and detail pages in Dreamweaver
- Dreamweaver User Guide
- Dreamweaver and Creative Cloud
- Dreamweaver workspaces and views
- Set up sites
- About Dreamweaver sites
- Set up a local version of your site
- Connect to a publishing server
- Set up a testing server
- Import and export Dreamweaver site settings
- Bring existing websites from a remote server to your local site root
- Accessibility features in Dreamweaver
- Advanced settings
- Set site preferences for transferring files
- Specify proxy server settings in Dreamweaver
- Synchronize Dreamweaver settings with Creative Cloud
- Using Git in Dreamweaver
- Manage files
- Create and open files
- Manage files and folders
- Getting and putting files to and from your server
- Check in and check out files
- Synchronize files
- Compare files for differences
- Cloak files and folders in your Dreamweaver site
- Enable Design Notes for Dreamweaver sites
- Preventing potential Gatekeeper exploit
- Layout and design
- Understand Cascading Style Sheets
- Laying out pages using CSS Designer
- Using CSS preprocessors in Dreamweaver
- How to set CSS Style preferences in Dreamweaver
- Move CSS rules in Dreamweaver
- Convert inline CSS to a CSS rule in Dreamweaver
- Work with div tags
- Apply gradients to background
- Create and edit CSS3 transition effects in Dreamweaver
- Format code
- Page content and assets
- Set page properties
- Set CSS heading properties and CSS link properties
- Work with text
- Find and replace text, tags, and attributes
- DOM panel
- Edit in Live View
- Encoding documents in Dreamweaver
- Select and view elements in the Document window
- Set text properties in the Property inspector
- Spell check a web page
- Using horizontal rules in Dreamweaver
- Add and modify font combinations in Dreamweaver
- Work with assets
- Insert and update dates in Dreamweaver
- Create and manage favorite assets in Dreamweaver
- Insert and edit images in Dreamweaver
- Add media objects
- Adding videos in Dreamweaver
- Insert HTML5 video
- Insert SWF files
- Add audio effects
- Insert HTML5 audio in Dreamweaver
- Work with library items
- Using Arabic and Hebrew text in Dreamweaver
- Linking and navigation
- jQuery widgets and effects
- Coding websites
- About coding in Dreamweaver
- Coding environment in Dreamweaver
- Set coding preferences
- Customize code coloring
- Write and edit code
- Code hinting and code completion
- Collapse and expand code
- Reuse code with snippets
- Lint code
- Optimize code
- Edit code in Design view
- Work with head content for pages
- Insert server-side includes in Dreamweaver
- Using tag libraries in Dreamweaver
- Importing custom tags into Dreamweaver
- About XML and XSLT
- Perform server-side XSL transformations in Dreamweaver
- Performing client-side XSL transformations in Dreamweaver
- Add character entities for XSLT in Dreamweaver
- Format code
- Cross-product workflows
- Installing and using extensions to Dreamweaver
- In-App updates in Dreamweaver
- Insert Microsoft Office documents in Dreamweaver (Windows only)
- Working with Fireworks and Dreamweaver
- Edit content in Dreamweaver sites using Contribute
- Dreamweaver-Business Catalyst integration
- Create personalized email campaigns
- About Dreamweaver templates
- Recognizing templates and template-based documents
- Create a Dreamweaver template
- Create editable regions in templates
- Create repeating regions and tables in Dreamweaver
- Use optional regions in templates
- Define editable tag attributes in Dreamweaver
- How to create nested templates in Dreamweaver
- Edit, update, and delete templates
- Export and import xml content in Dreamweaver
- Apply or remove a template from an existing document
- Edit content in Dreamweaver templates
- Syntax rules for template tags in Dreamweaver
- Set highlighting preferences for template regions
- Benefits of using templates in Dreamweaver
- Mobile and multiscreen
- Dynamic sites, pages and web forms
- Understand web applications
- Set up your computer for application development
- Troubleshoot database connections
- Removing connection scripts in Dreamweaver
- Design dynamic pages
- Dynamic content sources overview
- Define sources of dynamic content
- Add dynamic content to pages
- Changing dynamic content in Dreamweaver
- Display database records
- Provide and troubleshoot live data in Dreamweaver
- Add custom server behaviors in Dreamweaver
- Building forms using Dreamweaver
- Use forms to collect information from users
- Create and enable ColdFusion forms in Dreamweaver
- Create web forms
- Enhanced HTML5 support for form elements
- Develop a form using Dreamweaver
- Building applications visually
- Build master and detail pages in Dreamweaver
- Build search and results pages
- Build a record insert page
- Build an update record page in Dreamweaver
- Building record delete pages in Dreamweaver
- Use ASP commands to modify database in Dreamweaver
- Build a registration page
- Build a login page
- Build a page that only authorized users can access
- Securing folders in Coldfusion using Dreamweaver
- Using ColdFusion components in Dreamweaver
- Test, preview, and publish websites
Learn how to build a master page in Dreamweaver and create links to a detail page.
The user interface has been simplified in Dreamweaver CC and later. As a result, you may not find some of the options described in this article in Dreamweaver CC and later. For more information, see this article.
About master and detail pages
Master and detail pages are sets of pages used to organize and display recordset data. These pages provide a visitor to your site with both an overview and a detailed view. The master page lists all of the records and contains links to detail pages that display additional information about each record.
You can build master and detail pages by inserting a data object to create a master page and detail page in one operation or by using server behaviors to build the master and detail pages in a more customized way. When using server behaviors to build master and detail pages, you first create a master page to list the records and then add links from the list to the detail pages.
Build a master page
Before you start, ensure that you define a database connection for your site.
To create a blank page, select File > New > Blank Page, select a page type, and click Create. This page becomes the master page.
Define a recordset.
In the Bindings panel (Windows > Bindings), click the Plus (+) button, select Recordset, and choose options. If you want to write your own SQL statement, click Advanced.
Ensure that the recordset contains all the table columns you need to create your master page. The recordset must also include the table column containing the unique key of each record—that is, the record ID column. In the following example, the Code column contains the unique key of each record.
Typically, the recordset on the master page extracts a few columns from a database table while the recordset on the detail page extracts more columns from the same table to provide the extra detail.
The recordset can be defined by the user at run time. For more information, see Building search and results pages.
Insert a dynamic table to display the records.
Place the insertion point where you want the dynamic table to appear on the page. Select Insert > Data Objects > Dynamic Data > Dynamic Table, set the options, and click OK.
If you don’t want to show record IDs to users, you can delete the column from the dynamic table. Click anywhere on the page to move the focus to the page. Move the cursor near the top of the column in the dynamic table until the column cells are outlined in red, and then click to select the column. Press Delete to delete the column from the table.
Create links to the detail page
After building the master page and adding the recordset, you create links that open the detail page. You then modify the links to pass the IDs of the records the user selects. The detail page uses this ID to find the requested record in the database and display it.
You create links to update pages using the same process. The results page is similar to a master page, and the update page is similar to a detail page.
Open the detail page and pass a record ID (ColdFusion, PHP)
In the dynamic table, select the content placeholder for text that will serve as a link.
In the Property inspector, click the folder icon beside the Link box.
Browse and select the detail page. The detail page appears in the Link box in the Property inspector.
In the dynamic table, the selected text appears linked. When the page runs on the server, the link is applied to the text in every table row.
On the master page, select the link in the dynamic table.
(ColdFusion) In the Link box in the Property inspector, add the following string at the end of the URL:
The question mark tells the server that what follows is one or more URL parameters. The word recordID is the name of the URL parameter (you can make up any name you like). Make a note of the name of the URL parameter because you'll use it in the detail page later.
The expression after the equal sign is the value of the parameter. In this case, the value is generated by a ColdFusion expression that returns a record ID from the recordset. A different ID is generated for each row in the dynamic table. In the ColdFusion expression, replace recordsetName with the name of your recordset, and replace fieldName with the name of the field in your recordset that uniquely identifies each record. In most cases, the field will consist of a record ID number. In the following example, the field consists of unique location codes.
When the page runs, the values of the recordset's CODE field are inserted in the corresponding rows in the dynamic table. For example, if the Canberra, Australia, rental location has the code CBR, the following URL is used in the Canberra row in the dynamic table:
(PHP) In the Link field in the Property inspector, add the following string at the end of the URL:
?recordID=<?php echo $row_recordsetName['fieldName']; ?>
The question mark tells the server that what follows is one or more URL parameters. The word recordID is the name of the URL parameter (you can use any name you like). Make a note of the name of the URL parameter because you’ll use it in the detail page later.
The expression after the equal sign is the value of the parameter. In this case, the value is generated by a PHP expression that returns a record ID from the recordset. A different ID is generated for each row in the dynamic table. In the PHP expression, replace recordsetName with the name of your recordset, and replace fieldName with the name of the field in your recordset that uniquely identifies each record. In most cases, the field will consist of a record ID number. In the following example, the field consists of unique location codes.
locationDetail.php?recordID=<?php echo $row_rsLocations['CODE']; ?>
When the page runs, the values of the recordset’s CODE field are inserted in the corresponding rows in the dynamic table. For example, if the Canberra, Australia, rental location has the code CBR, the following URL is used in the Canberra row in the dynamic table:
Save the page.
Open the detail page and pass a record ID (ASP)
Select the dynamic content to double as a link.
In the Server Behaviors panel (Window > Server Behaviors), click the Plus (+) button, and select Go to Detail Page from the pop‑up menu.
In the Detail Page box, click Browse and locate the page.
Specify the value you want to pass to the detail page by selecting a recordset and a column from the Recordset and Column pop‑up menus. Typically the value is unique to the record, such as the record’s unique key ID.
If desired, pass existing page parameters to the detail page by selecting the URL Parameters or Form Parameters options.
A special link surrounds the selected text. When the user clicks the link, the Go To Detail Page server behavior passes a URL parameter containing the record ID to the detail page. For example, if the URL parameter is called id and the detail page is called customerdetail.asp, the URL looks something like the following when the user clicks on the link:
The first part of the URL, http://www.mysite.com/customerdetail.asp, opens the detail page. The second part, ?id=43, is the URL parameter. It tells the detail page what record to find and display. The term id is the name of the URL parameter and 43 is its value. In this example, the URL parameter contains the record’s ID number, 43.
Find and display the requested record on the detail page
In order to display the record requested by the master page, you must define a recordset to hold a single record and bind the recordset columns to the detail page.
Switch to the detail page. If you don’t have a detail page yet, create a blank page (File > New).
In the Bindings panel (Window > Bindings), click the Plus (+) button and select Recordset (Query) or DataSet (Query) from the pop‑up menu.
The simple Recordset or DataSet dialog box appears. If the advanced dialog box appears instead, click Simple.
Name the recordset, and select a data source and the database table that will provide data to your recordset.
In the Columns area, select the table columns to include in the recordset.
The recordset can be identical to or different from the recordset on the master page. Usually a detail page recordset has more columns to display more detail.
If the recordsets are different, make sure the recordset on the detail page contains at least one column in common with the recordset on the master page. The common column is usually the record ID column, but it can also be the join field of related tables.
To include only some of the table’s columns in the recordset, click Selected and choose the desired columns by Control‑clicking (Windows) or Command-clicking (Macintosh) them in the list.
Complete the Filter section as to find and display the record specified in the URL parameter passed by the master page:
From the first pop‑up menu in the Filter area, select the column in the recordset containing values that match the value of the URL parameter passed by the master page. For example, if the URL parameter contains a record ID number, select the column containing record ID numbers. In the example discussed in the previous section, the recordset column called CODE contains the values that match the value of the URL parameter passed by the master page.
From the pop‑up menu beside the first menu, select the equal sign (it should already be selected).
From the third pop‑up menu, select URL Parameter. The master page uses a URL parameter to pass information to the detail page.
In the fourth box, enter the name of the URL parameter passed by the master page.
Click OK. The recordset appears in the Bindings panel.
Bind the recordset columns to the detail page by selecting the columns in the Bindings panel (Window > Bindings) and dragging them onto the page.
After uploading both the master and detail pages to the server, you can open the master page in a browser. After clicking a detail link on the master page, the detail page opens with more information about the selected record.
Find a specific record and display it on a page (ASP)
You can add a server behavior that finds a specific record in a recordset so that you can display the record data on the page. The server behavior is only available when using the ASP server model.
Create a page that has the following prerequisites:
A record ID contained in a URL parameter passed by another page to the current page. You can create URL parameters on the other page with HTML hyperlinks or with an HTML form. For more information, see Using forms to collect information from users.
A recordset defined for the current page. The server behavior extracts the record details from this recordset. For instructions, see Define a recordset without writing SQL or Define an advanced recordset by writing SQL.
Recordset columns bound to the page. The specific record must be displayed on the page. For more information, see Make text dynamic.
Add the server behavior to find the record specified by the URL parameter by clicking the Plus (+) button on the Server Behaviors panel (Window > Server Behaviors) and selecting Recordset Paging > Move to Specific Record.
In the Move To Record In pop‑up menu, select the recordset you defined for the page.
In the Where Column pop‑up menu, select the column that contains the value passed by the other page.
For example, if the other page passes a record ID number, select the column containing record ID numbers.
In the Matches URL Parameter box, enter the name of the URL parameter passed by the other page.
For example, if the URL the other page used to open the detail page is id=43, enterid in the Matches URL Parameter box.
The next time the page is requested by a browser, the server behavior will read the record ID in the URL parameter passed by the other page and move to the specified record in the recordset.
Build master and detail pages in one operation
When developing web applications, you can quickly build master and detail pages using the Master Detail Page Set data object.
To create a blank dynamic page, select File > New > Blank Page, select a dynamic page from the Page Type list, and click Create.
This page becomes the master page.
Define a recordset for the page.
Make sure the recordset contains not only all the columns you’ll need for the master page, but also all the columns you’ll need for the detail page. Typically, the recordset on the master page extracts a few columns from a database table while the recordset on the detail page extracts more columns from the same table to provide the extra detail.
Open the master page in Design view, and select Insert > Data Objects > Master Detail Page Set.
In the Recordset pop‑up menu, make sure the recordset containing the records you want to display on the master page is chosen.
In the Master Page Fields area, select the recordset columns to display on the master page.
By default, all the columns in the recordset are selected. If your recordset contains a unique key column such as recordID, select it and click the Minus (-) button so that it is not displayed on your page.
To change the order in which the columns appear on the master page, select a column in the list and click the up or down arrow.
On the master page, the recordset columns will be arranged horizontally in a table. Clicking the up arrow moves the column to the left; clicking the down arrow moves the column to the right.
In the Link To Detail From pop‑up menu, select the column in the recordset that will display a value that also serves as a link to the detail page.
For example, if you want each product name on your master page to have a link to the detail page, select the recordset column containing product names.
In the Pass Unique Key pop‑up menu, select the column in the recordset containing values identifying the records.
Usually, the column chosen is the record ID number. This value is passed to the detail page so that it can identify the record chosen by the user.
Deselect the Numeric option if the unique key column is not numeric.Note:
This option is selected by default; it does not appear for all server models.
Specify the number of records to display on the master page.
In the Detail Page Name box, click Browse and locate the detail page file you created, or enter a name and let the data object create one for you.
In the Detail Page Fields area, select the columns to be displayed on the detail page.
By default, all the columns in the master page’s recordset are selected. If the recordset contains a unique key column such as recordID, select it and click the Minus (-) button so that it is not displayed on the detail page.
To change the order in which the columns appear on the detail page, select a column in the list and click the up or down arrow.
On the detail page, the recordset columns are arranged vertically in a table. Clicking the up arrow moves the column up; clicking the down arrow moves the column down.
The data object creates a detail page (if you didn’t already create one) and adds dynamic content and server behaviors to both the master and detail pages.
Customize the layout of the master and detail pages to suit your needs.
You can fully customize the layout of each page by using the Dreamweaver page-design tools. You can also edit the server behaviors by double-clicking them in the Server Behaviors panel.
After creating master and detail pages with the data object, use the Server Behaviors panel (Window > Server Behaviors) to modify the various building blocks the data object inserts into the pages.