Creating Dynamic Pages

As we've mentioned, regardless of the scripting language you choose, Dreamweaver MX lets you quickly create dynamic pages from a database using a three-step process:

  1. Establish the database connection.

  2. Create a recordset (or DataSet in ASP.NET) with a SQL statement or stored procedure.

  3. Output the results of that recordset.

Chapter 10 covered establishing a database connection. Now let's create a recordset (or DataDet in ASP.NET) with that database connection.

To create a recordset, we can use the Dreamweaver Recordset (or DataSet in ASP.NET) Server Behavior with a SQL statement or the Stored Procedure Server Behavior. As you know by now, a SQL statement is simply a set of instructions passed to the database to retrieve data. A stored procedure is an SQL statement stored in the database that can be called to retrieve data. Let's begin with the Recordset Server Behavior using an SQL statement and then move on to the Stored Procedure Server Behavior.

Recordset Server Behavior

When you insert a Recordset Server Behavior in your script page, Dreamweaver MX first displays the Recordset dialog box, shown in Figure 19.12, which you can use to set the parameters of the Server Behavior.

click to expand
Figure 19.12: The Recordset dialog box

Every Recordset Server Behavior requires three items to function properly:

  • A name for the recordset. The recordset name should be one word and free of characters such as ',", and /. Traditionally, developers use an RS_ prefix in a recordset name, such as RS_CATEGORY.

  • A functioning data connection. We created a functioning data connection for each Dreamweaver MX–supported language in Chapter 10. Dreamweaver MX lists each available data connection in the Connection drop-down list box in the Recordset dialog box.

  • An SQL statement that pulls data from your database.

SQL Statements

You can let Dreamweaver MX craft the SQL statement for you, or you can write your own SQL statement. To write your own SQL statement in the Recordset dialog box, click the Advanced button to switch to Advanced mode, which is shown in Figure 19.13.

click to expand
Figure 19.13: The Recordset dialog box in Advanced mode

Now, we're ready to create a recordset. In our example, the recordset will contain data from the Category table of our Books database. Follow these steps:

  1. Open Dreamweaver MX and then open a new page in your defined site.

  2. Save the file.

  3. To insert a Recordset Server Behavior (or DataSet in ASP.NET) in your script page, choose Insert ® Application Objects ® Recordset to open the Recordset dialog box.

  4. In the Name text box, enter RS_Category.

  5. In the Connection drop-down list box, select your Books database connection. Notice that Dreamweaver MX populates the Table list box with the tables available in the Books database.

At this point, we'll create the SQL statement that actually pulls data from the database and inserts it into the recordset. As we mentioned, you can let Dreamweaver MX craft an SQL statement based on the table and columns you choose in the Recordset dialog box, or you can switch the Recordset dialog box to Advanced mode and write your own SQL statement. Let's examine both methods.

A Simple Recordset

To let Dreamweaver MX generate a SQL statement based on your database table and column choice, follow these steps:

  1. From the Table drop-down list box, select tblCategories. Notice that Dreamweaver MX populates the Columns section with the available columns in the tblCategories table.

  2. You can set the generated SQL statement to return all table columns, or you can select specific columns. To return every column in the table, click the All radio button in the Columns section. To specify which columns the SQL statement returns, click the Selected radio button and choose the specific columns from the Columns list. (Hold down the Ctrl key to select multiple columns.)

In the Filter section, you set a comparison and a value for a specific table column. Doing so intructs the SQL statement to return only data matching that comparison and that value. Dreamweaver MX allows you to choose the following comparisons:

=

Equal

>

Greater than

<

Less than

>=

Greater than or equal to

<=

Less than or equal to

<>

Not equal to

begins with

Wildcard search for values beginning with the defined value

ends with

Wildcard search for values ending with the defined value

contains

Wildcard search for values containing the defined value

After you specify the comparisons, you must set a value. Dreamweaver MX provides the following six value types:

URL parameter

A variable and a value passed to the page through the URL

Form parameter

A variable and a value passed to the page through a submitted form

Cookie

A variable and a value stored in a cookie on the user's computer

Session variable

A variable set in the web server's memory and available to all pages the user visits

Application variable

A variable available to every page in your web application

Entered value

A value you enter in the recordset SQL statement

In the Sort section, you can sort the data returned to the recordset based on a specific column in the table and a direction you specify in the Direction list box. Dreamweaver MX automatically populates the Sort Column list box with the column names from the selected table in the Table drop-down list box.

Back to our example:

  1. To set the SQL statement to return records that have a value of 1 in the CategoryID column, select CategoryID from the Filter drop-down list box, select = from the Comparison list box, select Entered Value from the Value list box, and enter 1 in the Value text box in the Filter section.

  2. To sort the returned data alphabetically, select Category from the Column list, and select Ascending from the Direction list box in the Sort section.

The final configuration should appear similar to Figure 19.14. Now let's create the same SQL statement in the Advanced mode of the Recordset dialog box.

click to expand
Figure 19.14: The final simple Recordset configuration

An Advanced Recordset

Any time you need to populate a recordset with data from more than one table, you will need to craft your own SQL statement. In Advanced mode, the Recordset dialog box allows you to use a custom SQL statement in Dreamweaver MX to populate a recordset. Let's briefly review the properties of the Advanced dialog box, which is shown earlier in this chapter in Figure 19.13.

  • A recordset name and data connection are required.

  • An SQL text area allows you to write a custom SQL statement. Although you can write the SQL statement from scratch, Dreamweaver MX provides a point-and-click interface to help you build SQL using the Variables and Database Items sections.

  • The Variables section allows you to name a variable and define its default value and runtime value. The default value is used in the absence of the runtime value. The runtime value can be a static value or a dynamic variable defined in your script page.

  • The Database Items section allows you to create your SQL statement from the tables and columns available through the chosen data connection. You can add a table or column with the SELECT, WHERE, or ORDER BY clause by clicking the appropriate button.

To create the SQL statement in our example, follow these steps:

  1. In the Database Items section, select tblCategories.

  2. Click the SELECT button. Dreamweaver MX adds a simple SQL SELECT statement targeting the tblCategories table.

  3. If you want the SQL statement to return specific columns from a table, choose a column from the table in the Database Items section and click the SELECT button.

  4. Select CategoryID from the Database Items section, and click the WHERE button. Dreamweaver MX adds a WHERE clause to the SQL statement. Remember we want the SQL statement to pull only records with a CategoryID that matches 1.Therefore, enter =1 to the right of CategoryID in the WHERE clause.

  5. Select the Category column in the Database Items section and click the ORDER BY button. Dreamweaver MX adds an ORDER BY clause to the SQL statement.

You can see the final configuration of the Recordset dialog box in Advanced Mode in Figure 19.15.

click to expand
Figure 19.15: Create an SQL statement in the Recordset dialog box in Advanced mode

Testing Your Recordset

Regardless of the method you use to construct your SQL statement, you can test its validity from within the Recordset dialog box. To do so, click the Test button to open the Test SQL Statement dialog box, which is shown in Figure 19.16. If the SQL statement test is successful, you should see all the data your SQL statement returns.

click to expand
Figure 19.16: The Test SQL Statement dialog box

Once you're confident the recordset is valid, click OK in the Test SQL Statement dialog box, and then click OK in the Recordset dialog box to create the recordset. Dreamweaver MX places the required connection code and recordset code into the script file—ready to go.

Stored Procedures

Stored procedures are SQL statements that are saved in a database and can be triggered to retrieve data. Since stored procedures are already in the database and can make use of more powerful database- specific functions, stored procedures are ultimately faster and more powerful than SQL statements passed to the database through a web server. The Server Behavior to create a recordset with a stored procedure varies with the scripting language of your website. Nonetheless, the interface to call a stored procedure is similar to the Recordset dialog box. It requires a name, a data connection, a name for the resulting recordset, and the SQL to activate the stored procedure. The following list shows the Server Behavior you use to call a stored procedure per scripting language. (MySQL and Microsoft Access databases do not support stored procedures.)

Microsoft ASP

Command

Microsoft ASP NET

Stored Procedure

JSP

Callable (Stored Procedure)

Cold Fusion

Stored Procedure

To demonstrate how to use a Server Behavior to activate a stored procedure and return a recordset, we need access to a stored procedure. Obviously, detailing how to create a stored procedure for every type of database that Dreamweaver MX supports is out of the scope of this chapter. Therefore, let's limit our discussion to a common database such as Microsoft SQL Server. Let's create a simple stored procedure that targets the tblCategories table and filters data based on a value passed to the procedure. To do so, follow these steps:

  1. Open Microsoft SQL Server Enterprise Manager, and select the Books database.

  2. Choose Action ® New ® Stored Procedure to open the Stored Procedure Properties dialog box, which is shown in Figure 19.17.

    click to expand
    Figure 19.17: The Stored Procedure Properties dialog box

  3. Enter the code in Listing 19.1.

  4. Click OK to save the stored procedure.

 On the CD-Rom   You'll find all the listings in this chapter on the accompanying CD.

Listing 19.1: TBLCATEGORIES_SP

start example
CREATE PROCEDURE dbo.tblCategories_SP  @CategoryID int AS  select * from tblCategories where categoryid = @CategoryID GO

Now we'll add a Dreamweaver MX Server Behavior to a script file to activate the stored procedure and return a recordset. Since each language has its own way of activating a stored procedure, let's take it one language at a time.

end example

Microsoft ASP

ASP uses the Command Server Behavior to activate a stored procedure. To activate a stored procedure in ASP, follow these steps:

  1. Open a new script file in your ASP website, and name it storedprocedure.asp.

  2. Choose Window ® Server Behaviors to open the Server Behaviors panel.

  3. Click the plus sign (+) on the panel and choose Command to open the Command dialog box, which is shown in Figure 19.18.

    click to expand
    Figure 19.18: The Command dialog box

The interface for the Command Server Behavior is similar to the Advanced mode of the Recordset Server Behavior interface. The Command Server Behavior requires a name for the command, a data connection, a name for the returned recordset, and the SQL statement to activate the stored procedure. In addition, there is a Variables section and a Database Items section to help you create the SQL statement. As before, the Variables section allows you to set a test, or default value, and a runtime value. The Database Items section provides you with a point-and-click interface to choose your stored procedure.

  1. To set the Command Server Behavior to activate the tblCategories_SP stored procedure, enter Cmd_Category in the Name text box

  2. Select a data connection from the Connection drop-down list box.

  3. Click the the Return Recordset Named check box and enter RS_Category in the text box.

As you choose the data connection, Dreamweaver MX populated the Database Items section with the tables, views, and stored procedures available in the Books database.

  1. To target our stored procedure, simply expand the Stored Procedure node of the Database Items section and select tblCategories_SP from our list. Doing so inserts the name of the stored procedure into the SQL text area and populates the Variables section with the variables needed for the stored procedure to function.

The @Category parameter of our stored procedure requires a size, a test or default value, and a runtime value for the variable. A runtime variable is simply a variable passed to or set in the script page. If the runtime variable does not exist, Dreamweaver MX substitutes the test or default value. Fortunately, Dreamweaver MX inserts a default runtime value, Request("CategoryID"), that is based on the parameter name.

  1. Click the @CategoryID row and enter 4 in the Size column and 1 in the Value column of the @CategoryID row, as shown in Figure 19.19.

    click to expand
    Figure 19.19: The final configuration of the ASP Command Server Behavior

  2. Click the Test button to preview the data that the stored procedure returns.

  3. Once you are satisfied that the Command Server Behavior works correctly, click OK to save your settings and insert the code in your script page.

The final code should look similar to Listing 19.2.

Listing 19.2: THE ASP COMMAND SERVER BEHAVIOR

start example
<%@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>  <!--#include file="Connections/SQLSERVER_OLEDB.asp" -->  <%     Dim Cmd_category__CategoryID Cmd_category__CategoryID = "1" if(Request("CategoryID") <> "") then _  Cmd_category__CategoryID = Request("CategoryID")     %>  <%     set Cmd_category = Server.CreateObject("ADODB.Command")  Cmd_category.ActiveConnection = MM_SQLSERVER_OLEDB_STRING  Cmd_category.CommandText = "dbo.tblCategories_SP"  Cmd_category.Parameters.Append  Cmd_category.CreateParameter("@RETURN_VALUE", 3, 4)  Cmd_category.Parameters.Append _  Cmd_category.CreateParameter("@CategoryID", 3, 1,1,Cmd_category__CategoryID)  Cmd_category.CommandType = 4 Cmd_category.CommandTimeout = 0 Cmd_category.Prepared = true set rs_category = Cmd_category.Execute rs_category_numRows = 0     %>  <html>  <head>  <title>Stored Procedure</title>  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">  </head>     <body>  </body>  </html>
end example

Microsoft ASP.NET

ASP.NET uses the Stored Procedure Server Behavior to activate a stored procedure and return a DataSet. To use the Stored Procedure Server Behavior to return a recordset, follow these steps:

  1. Open a new script file in your ASP.NET website and name it storedprocedure.aspx.

  2. Choose Window ®Server Behaviors to open the Server Behaviors panel.

  3. Click the plus sign (+) on the panel, and choose Stored Procedure to open the Stored Procedure dialog box shown in Figure 19.20.

    click to expand
    Figure 19.20: The ASP.NET Stored Procedure Server Behavior

The interface for the Stored Procedure Server Behavior is similar to the Advanced mode of the Recordset Server Behavior interface and the Command Server Behavior interface. The Stored Procedure Server Behavior requires a name, a data connection, a name for the returned DataSet, and the stored procedure to activate. In addition, there are a Parameters section in which to define variables to pass to the stored procedure and an On Success, Go To and On Failure, Go To sections that allow you to further specify what the web server should do in case of success or failure.

  1. To set the Server Behavior to activate our tblCategories_SP stored procedure, enterSP_Category in the Name text box.

  2. In the Connection drop-down list box, select a data connection.

  3. Click the Return DataSet check box, and choose tblCategories_SP from the list of available stored procedures provided by the selected data connection. As you choose the stored procedure, Dreamweaver MX populates the Parameters section with variables required for the stored procedure to function.

  4. To set the value for the @Category parameter, you must choose a datatype for the variable, a size, a test or default value, and a runtime value. To do so, select @CategoryID, and click the Edit button to open the Edit Parameter dialog box, which is shown in Figure 19.21.

    click to expand
    Figure 19.21: The ASP.NET Edit Parameter dialog box

  5. From the Type drop-down list box, choose Int.

  6. In the Size text box, enter 4.

  7. In the Direction drop-down list box, select Input.

  8. In the Text Value text box, enter 1.

At this point, you can enter a value for @CategoryID or let Dreamweaver MX help you create a runtime variable for the value. The source of the runtime variable can be set from a URL or QueryString or from a form, application, session, or cookie value.

  1. To let Dreamweaver MX help you create a runtime variable as the value of the @CategoryID stored procedure parameter, click the Build button to open the Build Value dialog box, which is shown in Figure 19.22.

    click to expand
    Figure 19.22: The ASP.NET Build Value dialog box

  2. Enter a name for your runtime variable, choose a source, and enter a value as the default value for the runtime variable.

For our stored procedure, we set CategoryID as the variable name, URL Parameter as the source, and 1 as the default value.

  1. Click OK to close the Build Value dialog box and return to the Edit Parameter dialog box.

As you can see in the Value text area of the Edit Parameter dialog box shown in Figure 19.23, Dreamweaver MX has built the ASP.NET code to check for the existence and value of a URL parameter named CategoryID. If the URL parameter exists and has a value, the code passes the value to the stored procedure. If the URL parameter does not exist or does not have a value, the code passes the default value of 1 to the stored procedure.

click to expand
Figure 19.23: The ASP.NET Edit Parameter dialog box with generated code

  1. Click OK to close the Edit Parameter dialog box.

  2. In the Stored Procedure dialog box, click the Test button to check the validity of your settings. If all went well, Dreamweaver MX displays the returned data.

  3. Once you are satisfied that the configuration of the Stored Procedure Server Behavior is correct, click OK to add the ASP.NET code to your script page, as shown in Listing 19.3.

Listing 19.3: THE ASP.NET STORED PROCEDURE SERVER BEHAVIOR

start example
<%@ Page Language="VB" ContentType="text/html" ResponseEncoding="iso-8859-1" %>  <%@ Register TagPrefix="MM" Namespace="DreamweaverCtrls" _  Assembly="DreamweaverCtrls,version=1.0.0.0,_  publicKeyToken=836f606ede05d46a,culture=neutral" %> <MM:DataSet runat="Server" IsStoredProcedure="true" CreateDataSet="true" ConnectionString='<%# System.Configuration.ConfigurationSettings._  AppSettings("MM_CONNECTION_STRING_BookTrackingSQL") %>'  DatabaseType='<%# System.Configuration.ConfigurationSettings._  AppSettings("MM_CONNECTION_DATABASETYPE_BookTrackingSQL") %>'  CommandText="dbo.tblCategories_SP" Debug="true"  >  <Parameters>    <Parameter Name="@RETURN_VALUE" Type="Int" Direction="ReturnValue" />    <Parameter Name="@CategoryID" _  Value='<%# IIf((Request.QueryString("CategoryID") <> Nothing), _  Request.QueryString("CategoryID"), "1") %>' _  Type="Int" Size="4" Direction="Input" />    </Parameters>  </MM:DataSet>  <MM:PageBind runat="server" PostBackBind="true" />  <html> <head> <title>Stored Procedure</title>  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body>     </body>  </html>
end example

JavaServer Pages

JavaServer Pages (JSP) uses the Callable (Stored Procedure) Server Behavior to activate a stored procedure and return a DataSet. To use the Callable (Stored Procedure) Server Behavior to return a recordset, follow these steps:

  1. Open a new script file in your JSP website and name it storedprocedure.jsp.

  2. Choose Window ® Server Behaviors to open the Server Behaviors panel.

  3. Click the plus sign (+) on the panel and choose Callable (Stored Procedure) to open the Callable (Stored Procedure) dialog box, which is shown in Figure 19.24.

    click to expand
    Figure 19.24: The JSP Callable (Stored Procedure) Server Behavior

As expected, the interface for the Callable (Stored Procedure) Server Behavior is similar to the previous stored procedure Server Behavior interfaces. The JSP Callable (Stored Procedure) Server Behavior requires a name, a data connection, a name for the returned DataSet, and the stored procedure to activate. In addition, there are a Variables section in which to define variables to pass to the stored procedure and a Database Items section providing a point-and-click interface for you to choose the stored procedure.

  1. To set the Callable (Stored Procedure) Server Behavior to activate our tblCategories_SP stored procedure, enter SP_Category in the Name text box.

  2. In the Connection drop-down list box, select a data connection.

  3. Click the Return Recordset check box, and enter RS_Category in the Recordset Name text box.

As you choose the data connection, Dreamweaver MX populates the Database Items section with the tables, views, and stored procedures available in the Books database.

  1. To target the stored procedure, simply expand the Stored Procedure node of the Database Items section, and select tblCategories_SP from the list. Doing so inserts the name of the stored procedure in the Callable Text text area and populates the Variables section with the variables needed for the stored procedure to function.

  2. To set the value for the @Category parameter, you must set a test or default value and a runtime value. To do so, select the @CategoryID row and enter 1 in the Default Value column.

  3. In the Run-time Value column, Dreamweaver MX places the code to pull a value from a variable passed to our script page. However, it leaves the variable naming up to you. Therefore, click the Run-time Value column cell and insert CategoryID between the quotes of the JSP code, as shown in Figure 19.25.

    click to expand
    Figure 19.25: Setting a runtime value in the Callable (Stored Procedure) Server Behavior

  4. Before closing the dialog box, click Test to check the validity of your Callable (Stored Procedure) Server Behavior configuration. If successful, Dreamweaver MX displays the data that will be placed in the recordset.

  5. Once you are satisfied the configuration of the Callable (Stored Procedure) Server Behavior is correct, click OK to add the JSP code to your script page, as shown in Listing 19.4.

Listing 19.4: THE JSP CALLABLE (STORED PROCEDURE) SERVER BEHAVIOR

start example
<%@ page contentType="text/html; charset=iso-8859-1" _  language="java" import="java.sql.*" errorPage="" %>  <%@ include file="Connections/BookTrackingMsSQL2.jsp" %>  <%     String SP_Category__CategoryID = "1";  if(request.getParameter("CategoryID") != null)_  { SP_Category__CategoryID = (String)request.getParameter("CategoryID");}     %>  <%     Driver DriverSP_Category = _  (Driver)Class.forName(MM_BookTrackingMsSQL2_DRIVER).newInstance(); Connection ConnSP_Category = _  DriverManager.getConnection(MM_BookTrackingMsSQL2_STRING,_  MM_BookTrackingMsSQL2_USERNAME,MM_BookTrackingMsSQL2_PASSWORD);  CallableStatement SP_Category = ConnSP_Category._  prepareCall("{?= call dbo.tblCategories_SP(?)}");  SP_Category.registerOutParameter(1,Types.LONGVARCHAR);  SP_Category.setString(2,SP_Category__CategoryID);  Object SP_Category_data; SP_Category.execute(); ResultSet RS_Category = SP_Category.getResultSet();  boolean RS_Category_isEmpty = !RS_Category.next();  boolean RS_Category_hasData = !RS_Category_isEmpty;  Object RS_Category_data;  int RS_Category_numRows = 0;     %>  <html>  <head>  <title>Stored Procedure</title>  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">  </head>     <body>  </body>  </html>  <% ConnSP_Category.close();  %>
end example

ColdFusion

ColdFusion uses the Stored Procedure Server Behavior to activate a stored procedure. To use the Stored Procedure Server Behavior to return a recordset, follow these steps:

  1. Open a new script file in your ColdFusion website, and name it storedprocedure.cfm.

  2. Choose Window ® Server Behaviors to open the Server Behaviors panel.

  3. Click the plus sign (+) and choose Stored Procedure to open the Stored Procedure dialog box, which is shown in Figure 19.26.

    click to expand
    Figure 19.26: The ColdFusion Stored Procedure dialog box

The interface for the Stored Procedure Server Behavior is slightly different from the previous Server Behavior interfaces we've looked at. The ColdFusion Stored Procedure Server Behavior requires a data source, a name for the returned recordset, and the name of the stored procedure to activate. In addition, there are a Parameters section and a Page Parameters section that allow you to set a test or default value and a runtime value to pass to the stored procedure and set a script page variable with a default value.

To set the Stored Procedure Server Behavior to activate our tblCategories_SP stored procedure, follow these steps:

  1. Select a data connection in the Data Source drop-down list box and enter the username and password if applicable.

  2. Select the tblCategories_SP from the list of available stored procedures in our SQL Server database.

  3. Click the Returns Recordset Named check box and enter RS_Category in the text box.

  4. To set a script page variable named CategoryID with a default value of 1, click the plus sign (+) in the Page Parameters section to open the Add Parameter dialog box, which is shown in Figure 19.27.

    click to expand
    Figure 19.27: The ColdFusion Add Parameter dialog box

  5. Enter CategoryID in the Name text box, and enter 1 into the Default Value text box.

  6. Click OK to return to the Stored Procedure dialog box.

As you selected the stored procedure, Dreamweaver MX populated the Procedure section with the variables required for the stored procedure to function. To set the value for the @Category parameter of our stored procedure, you must set an SQL datatype, a runtime value for the variable, and a test or default value.

  1. Select @CategoryID in the Parameters section, and click the Edit button to open the Edit Stored Procedure Variable dialog box, which is shown in Figure 19.28.

    click to expand
    Figure 19.28: The ColdFusion Edit Stored Procedure Variable dialog box

  2. Dreamweaver MX guesses the direction, SQL type, and runtime value for the @CategoryID parameter. All that you must do is confirm that the Dreamweaver MX guesses are correct. If they are correct, enter 1 in the Test Value text box.

  3. Click OK to return to the Stored Procedure dialog box.

  4. Now you're ready to test your stored procedure configuration. To do so, click Test. If successful, Dreamweaver MX displays the data that will be placed in the recordset.

  5. Once you are satisfied that the configuration of the Stored Procedure Server Behavior is correct, click OK to add the ColdFusion code to your script page, as shown in Listing 19.5.

Listing 19.5: THE COLDFUSION STORED PROCEDURE SERVER BEHAVIOR

start example
<cfparam name="CategoryID" default="1">  <CFSTOREDPROC procedure="dbo.tblCategories_SP" datasource="MsSQLServer_Book">  <CFPROCPARAM type="IN"   dbvarname="@CategoryID"   value="#CategoryID#" cfsqltype="CF_SQL_INTEGER">  <cfprocresult name="RS_CATEGORY">  </CFSTOREDPROC> <html> <head>  <title>Stored Procedure</title>  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">  </head> <body>  </body>  </html>
end example

Displaying Data

At this point, we're all up to speed establishing the database connection and retrieving data from a database as a recordset (or DataSet in ASP.NET). The missing step is to output the results of that recordset. Numerous Dreamweaver MX Server Behaviors can help you output data to your dynamic pages. More, your chosen scripting language might even have dynamic data output unique to its technology, such as DataGrid and DataList available in ASP.NET. Following is a list of the Server Behaviors available to output dynamic data categorized under scripting languages. Keep in mind that there is often more than one way to output dynamic data to a script page.

For ASP, Dreamweaver MX provides the following Server Behaviors to output dynamic data:

  • Dynamic Text

  • Dynamic Table

  • Recordset Navigation Bar

  • Recordset Navigation Status

  • Repeat Region

  • Master/Detail Page Set

For ASP.NET, Dreamweaver MX provides the following Server Behaviors to output dynamic data:

  • Dynamic Text

  • DataGrid

  • DataList

  • DataSet Navigation Bar

  • DataSet Navigation Status

  • Repeat Region

For JavaServer Pages, Dreamweaver MX provides the following Server Behaviors to output dynamic data:

  • Dynamic Text

  • Dynamic Table

  • Recordset Navigation Bar

  • Recordset Navigation Status

  • Repeat Region

For Macromedia ColdFusion, Dreamweaver MX provides the following Server Behaviors to output dynamic data:

  • Dynamic Text

  • Dynamic Table

  • Recordset Navigation Bar

  • Recordset Navigation Status

  • Repeated Region

  • Master/Detail Page Set

For PHP, Dreamweaver MX provides the following Server Behaviors to output dynamic data:

  • Dynamic Text

  • Dynamic Table

  • Recordset Navigation Bar

  • Recordset Navigation Status

  • Repeated Region

The Dynamic Text Server Behavior

The Dynamic Text Server Behavior allows you to place data pulled from a database anywhere in your script page. You can place dynamic text as text in the HTML body, as attributes of HTML tags, or as attributes of embedded objects such as Macromedia Flash. For example, in the following ColdFusion script, we use the Dynamic Text Server Behavior to set the title of the script page and the source of an image tag and to add text to the script page.

<cfquery name="RS_Category" datasource="MsSQLServer_Book">  SELECT * FROM dbo.tblCategories </cfquery> <html> <head>  <title><cfoutput>#RS_Category.Category#</cfoutput></title>  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">  </head> <body>  <img src="/books/1/127/1/html/2/images/<cfoutput>#RS_Category.CategoryID#</cfoutput>.gif">  <h2>#RS_Category.Category#</h2>  </body> </html>

Let's walk through the process we used to create this script. First let's place dynamic text in the body of our script page and apply the H2 style. To place dynamic text into a script page, you of course need an active recordset or DataSet. Follow these steps:

  1. Place your cursor at the page position where you want the dynamic text to appear.

  2. Choose Insert ® Application Objects ® Dynamic Text to open the Dynamic Text dialog box shown in Figure 19.29.

    click to expand
    Figure 19.29: The Dynamic Text dialog box

Dreamweaver MX displays the available data columns of the active recordset in the Field section and displays a Format drop-down list box, and a Code text box. The Field section is a point-and-click interface you can use to select the data column you want to use to populate your dynamic text. The Format list box allows you to format the data value of the dynamic text. You can choose to format text, numbers, or dates. For example, you can choose to display 01/01/2003 as January 01, 2003. Dreamweaver MX populates the Code text box based on your choices in the Field section and the Format list box. However, you can alter the resulting code.

  1. Select your options, and then click OK to add the dynamic text to your script page.

  2. Simply apply the H2 heading style to the dynamic text.

Next let's set the source of an image to dynamic text. For example, you've created an icon image for each category in the Books database. One way to comply with web filename restrictions and tie each icon image to a category in the database is to name the icon image according to the primary key of the category. This allows you to reference the appropriate category icon image by referencing the CategoryID of the tblCategories table.

  1. Choose Insert ® Image to open the Select Image Source dialog box, which is shown in Figure 19.30.

    click to expand
    Figure 19.30: The Data Source view of the Select Image Source dialog box

  2. Click the Data Source radio button to view the data columns in the active recordset on your script page.

  3. To set the source of the image tag to a data column, simply select a data column.

  4. Click OK to close the dialog box and insert the image tag in your script page.

If you decide to edit the SRC attribute or add dynamic data to a new attribute, simply select the image and activate the Bindings panel. To do so, follow these steps:

  1. Choose Window ® Bindings to open the Bindings panel.

  2. To change the attribute attached to the dynamic data, click the drop-down list box next to the CategoryID data column.

The drop-down list box contains every attribute of the selected image tag. You can also choose a format for the dynamic data through the Format drop-down list box.

  1. To attach new dynamic data to another attribute of the selected image tag, select another data column and choose an attribute from the Bind To drop-down list box located at the bottom of the Bindings panel, as shown in Figure 19.31.

    click to expand
    Figure 19.31: Attach dynamic data to HTML attributes through the Bindings panel

Yet another way to add dynamic data to your script page is drag-and-drop. To demonstrate, let's add the Category data column to the <TITLE> tag of our script page. To do so, follow these steps:

  1. Switch to Code view.

  2. In the Bindings panel, click and drag the Category data column to your script page and drop it between the opening and closing <TITLE> tags. Dreamweaver MX places the dynamic text with the appropriate output code into the proper position of your script page.

As you can see, you can add dynamic data to your script pages in many ways. Although the three methods we've shown you are fast and incredibly easy, they are limited to one piece of a recordset at a time. Dreamweaver MX has even other methods for adding an entire recordset of dynamic data to your script pages—Server Behaviors.

The Repeat Region Server Behavior

The Repeat Region Server Behavior loops through all records of the recordset. Whatever logic or HTML display code is inside the Repeat Region is run or output for each record in the recordset. To demonstrate the Repeat Region Server Behavior, let's create an HTML table to hold each record of the tblCategories data table. To do so, we want to repeat a single row of the table and not the table itself. Follow these steps:

  1. Create a table that has one row and two columns.

    Tip 

    The simplest way to add a table is to choose Insert ® Table to open the Table dialog box. Enter 1 in the Row text box, and enter 2 in the Column text box. Click OK to close the dialog box and insert your table in your Dream- weaver page.

  2. Following the procedure we outlined earlier, add dynamic text for the CategoryID and Category columns of tblCategories to each table column. Your table should now look similar to Figure 19.32.

    click to expand
    Figure 19.32: Creating a table for the Repeat Region Server Behavior

Now let's add the Repeat Region Server Behavior.

  1. Select only the row of the table. You can do so in many ways, but the simplest is to place your cursor in the table and select <TR> from the footer of your script file document window.

  2. Choose Insert ® Application Objects ® Repeat Region to open the Repeat Region dialog box, which is shown in Figure 19.33.

    click to expand
    Figure 19.33: The Repeat Region Server behavior dialog box

  3. From the Recordset drop-down list box, select a recordset, and then set the number of records to display.

  4. Click OK.

Dreamweaver MX wraps the table row with the Repeat Region Server Behavior code. You can see the result in Live Data view in Figure 19.34. It couldn't get any simpler, could it? But wait, it can!

click to expand
Figure 19.34: The live data results of the Repeat Region Server Behavior

The Dynamic Table Server Behavior

The Dynamic Table Server Behavior fully automates the creation and population of an HTML table with dynamic data using the Repeat Region Server Behavior. Don't tell your boss, but the only thing you have to do is create a recordset and attach it to the Dynamic Table Server Behavior. To add a Dynamic Table Server Behavior to your script page, follow these steps:

  1. Choose Insert ® Application Objects ® Dynamic Table to open the Dynamic Table dialog box shown in Figure 19.35.

    click to expand
    Figure 19.35: The Dynamic Table dialog box

  2. Select the recordset with which to populate the table and choose the number of records to display per page plus the cell padding and cell spacing of the HTML table.

  3. Click OK to create a table to output all the values of our recordset as shown in Live Data view in Figure 19.36.

    click to expand
    Figure 19.36: The live data results of the Dynamic Table Server Behavior

The Recordset Navigation Bar Server Behavior

Up to this point, each Server Behavior we've demonstrated outputs all available records in a recordset. At times, this behavior is not appropriate. For example, a recordset that contains hundreds of records would slow down the creation and display of a web page to an unacceptable level. When these situations arise, you can use Repeat Region and Recordset Navigation Bar to limit the amount of data sent to a web browser—thereby maintaining a fast download and response speed. In addition, the Recordset Navigation Bar Server Behavior also empowers the user to navigate through the data at their leisure.

The first step is to set the Repeat Region or the Dynamic Table Server Behavior to display a limited number of records. You then add the Recordset Navigation Bar Server Behavior to your script page. The Recordset Navigation Bar is a collection of Server Behaviors that create links that display the beginning, end, previous, or next record in the recordset. Further, the Server Behavior takes care of all the logic associated with navigating through a recordset, such as "Is there another record to display or is the current record displayed the last record in the recordset?"

To add a Recordset Navigation Bar to your script page, follow these steps:

  1. Choose Insert ® Application Objects ® Recordset Navigation Bar to open the Recordset Navigation Bar dialog box shown in Figure 19.37.

    click to expand
    Figure 19.37: The Recordset Navigation Bar Server Behavior dialog box

  2. Choose the recordset, and select the navigation links to appear as text or images.

  3. Click OK to create the text recordset navigation bar or the image recordset navigation bar. You can see examples of both in Figure 19.38.

    click to expand
    Figure 19.38: The Recordset Navigation Bar Server Behavior

Although the Recordset Navigation Server Behavior is listed as one Server Behavior, it actually consists of several Server Behaviors. The following Server Behaviors make up the Recordset Navigation Bar:

  • Show If Recordset Is Empty

  • Show If Not First Record

  • Move To First Record

  • Move to Previous Record

  • Move To Next Record

  • Show If Not Last Record

  • Move To Last Record

The Recordset Navigation Status Server Behavior

The Recordset Navigation Status Server Behavior goes hand in hand with the Recordset Navigation Bar Server Behavior. The Recordset Navigation Status Server Behavior displays the current record out of the total number of records in the recordset; the Navigation Bar becomes a less powerful tool without it. To add the Recordset Navigation Status Server Behavior to your script page, follow these steps:

  1. Choose Insert ® Application Objects ® Recordset Navigation Status to open the Recordset Navigation Status dialog box shown in Figure 19.39.

    click to expand
    Figure 19.39: The Recordset Navigation Status Server Behavior

  2. In the Recordset drop-down list box, select the appropriate recordset and click OK.

Figure 19.40 shows the browser result of the Recordset Navigation Status Server Behavior.

click to expand
Figure 19.40: The browser result of the Recordset Navigation Status Server Behavior

ASP.NET-Specific Server Behaviors—Repeater, DataList, DataGrid

ASP.NET provides three unique Server Behaviors to output data from a data source—Repeater, DataList, and DataGrid. Repeater is similar to the Repeat Region server control that all the scripting languages provide, but it has a unique twist. Instead of simply repeating whatever might be inside the repeating region, the ASP.NET Repeater Server Behavior allows you to define various templates of code. You can set these templates to execute only during specific events. For example, you can create templates to alternate display rows in a table or display a certain visual style only for the column headings of a recordset. Similarly, DataList and DataGrid are unique Server Behaviors that also display data based on defined templates. DataList is similar to the Repeater Server Behavior, but gives the user the ability to interact and modify the data presented in the browser window. Even more powerful than DataList is the DataGrid Server Behavior. DataGrid generates a multicolumn table from a DataSet. Each generated column is of a specific type—data, button, hyperlink, template, or custom. In Chapter 15, we delved deeply into these and more ASP.NET server controls.

Master/Detail Page Set Server Behavior

Using the Master/Detail Page Set Server Behavior is a quick and effiicient way to present information to a user. A master/detail page set consists of two pages—the master page and the detail page. The master page lists limited amounts of information about the records in a recordset. Each record is displayed with a link to a detail page, which displays more information about the record the user clicked in the master page. Dreamweaver MX doesn't provide the Master/Detail Page Set Server Behavior for every supported language. However, using other Server Behaviors you can build your own master/detail page set. We'll leave further discussion of the whats, wheres, and hows of master/detail page sets for Chapter 21.

start sidebar
For Further Information

The best place to find and research Server Behaviors and other Dreamweaver MX extensions is the Macro- media Exchange site at http://dynamic.macromedia.com/bin/MM/ exchange/main.jsp?product= ultradev. Another resource for the latest and greatest Server Behaviors is www.dmxzone.com and www.dwteam.com. If you're more interested in creating your own Server Behaviors, check out the Macro- media technotes articles at www.macromedia.com/support/ ultradev/content/ creating_sbs/ and www.macromedia.com/support/ ultradev/behaviors/ create_extensions/create_extensions04.html.

end sidebar



Mastering Dreamweaver MX Databases
Mastering Dreamweaver MX Databases
ISBN: 078214148X
EAN: 2147483647
Year: 2002
Pages: 214

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