Tải bản đầy đủ (.pdf) (50 trang)

Adobe Dreamweaver CS3 Unleashed- P24 pdf

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (742.62 KB, 50 trang )


Building the Vecta Corp Employee Store Using ASP, ColdFusion, or
PHP
If you read the title of this section, chances are you're wondering why we're covering ASP, ColdFusion, and
PHP in a single section. The answer to this question is simple; Dreamweaver's core functionality is so similar
across the three server models that individual sections for each server-side technology aren't warranted.
Instead, we'll build our dynamic web pages using the ASP server model, pointing out the small differences
and additions for the other two server models along the way.
In the coming sections, you'll learn to build the dynamic employee store web page using ASP, ColdFusion, or
PHP. As the chapter unfolds you'll learn about the various Dreamweaver features that make working with
database data a snap. Specifically, you'll learn about the following concepts:
Recordsets
Paging
Dynamic text
Region repeaters
Showing specific regions (conditionals)
By the end of this chapter, you'll have a fully functional employee store web page that pulls product
information directly from a database and displays it for users to purchase. Let's get started.
Creating the EmployeeStore Page
The EmployeeStore page of the Vecta Corp intranet site is the heart of the Vecta Corp web application. After
all, this is where Vecta Corp employees come to buy flare and tchotchkes (marketing lingo for lame and
unusable stuff) to show off their Vecta Corp pride to co-workers, friends, and family. The idea is that
employees will visit the page, and the page will pull information from the EmployeeStore table contained in
the vectacorp database and present items to the users for purchase. The users can then click an item, add it
to their carts, and complete their purchase using a convenient checkout button. All this functionality will be
outlined in time. For now, let's review the basic structure of our vectacorp database, specifically, the
EmployeeStore table. As Figure 24.18 indicates, we can expand the EmployeeStore table directly from the
Databases panel (by clicking the small (+) icon) to reveal the field names and the data types associated
with each field.
Figure 24.18. The EmployeeStore table is the central source of data for the EmployeeStore web
page.


Table 24.1 outlines the fields in the database table, including the data types used by Dreamweaver.
Table 24.1. Fields in the EmployeeStore Database Table
Field Name
Data Type
Description
ItemID
Integer
The unique identifier for each item in the EmployeeStore
table. Whenever we make updates, modifications, or
remove items from the EmployeeStore table, this value
serves as a base point.
ItemName
WChar
A generic name for each item in the table.
ItemDescription
WChar
A marketing description about the item for sale.
ImageURL
WChar
A path to the image in the Images directory of our defined
site. Rather than physically storing the image in the
database, we store the image on the file system and
reference that image by storing the path in the database.
This effectively reduces database file size at the expense
of disk space.
Cost
Numeric
A currency value that represents the cost of the item for
sale.
Quantity

Integer
A numeric value indicating how many of a specific item
are left in stock.
Now that you've seen the database structure, you are ready to begin extracting data from it. Let's build that
functionality now.
Creating a Recordset
By now you may be curious about how data in your database can be extracted into your application. Sure,
you've learned a lot about SQL and are familiar with the commands to retrieve the information, but now
what? SQL alone does not provide enough flexibility to read from the database and write that data to the
application; there's still a piece of the puzzle missing. That piece is the recordset. Recordsets act as an
intermediary virtual table between the database and the application. You can write SQL commands to ask
questions of the database (also known as a query), but the information retrieved is stored in a recordset.
The programming logic iterates through the recordset and ultimately presents the data to the browser in a
structured way. Figure 24.19 illustrates this point.
Figure 24.19. The application makes a call to the database, which then returns data in the form of
a recordset.
[View full size image]
Remember that the questions asked of the database are made in the form of queries, and queries are a
process that usually involve SQL to structure how the question will be asked. After the question (query) has
been asked, the data is returned into a virtual table or recordset. The recordset is then browsed through by
the application logic and presented to the user in a structured HTML document.
To demonstrate this point, you can use Dreamweaver to create a simple recordset that will query the
EmployeeStore table. To create a recordset, follow these steps:
1.
With the Application panel group open, switch to the Bindings tab and click the Add (+) button. Select
Recordset (Query) from the list that appears when you click the Add (+) button. The Recordset dialog
appears.
2.
In the Name text box, type the name rsEmployeeStore.
3.

Select the connVectaCorp option from the Connection drop-down menu. If the name of your connection
does not appear in the drop-down menu, it means that you haven't yet defined the connection. Review
the first part of this chapter for information on creating a connection. Selecting the connection option
from the list reveals a set of tables in the Table drop-down list. These are the database tables that
exist in the vectacorp database to which you've just connected.
Note
If you're using ColdFusion, make note of the User Name and Password text boxes. If
your DSN requires authentication before connecting to the data source, enter those
credentials here.
4.
Pick the table in the Table menu for which you want to create a recordset. In our case, choose the
EmployeeStore option.
5.
You'll have the opportunity to choose all or selected fields from the database table. For the sake of
demonstration, keep the All option button selected.
6.
Optionally, you can filter and sort the data based on specific values. More on this later. For now, the
configured Recordset dialog should resemble Figure 24.20.
Figure 24.20. Fill out all the information in the Recordset dialog.
7.
Click the Test button to see a sample of the results that will be returned. Figure 24.21 shows the
returned recordset with all the data from the EmployeeStore table. Now that you know that the
recordset works, click OK.
Figure 24.21. The test results show the recordset with populated data.
[View full size image]
Note
The ColdFusion model optionally supports connections using ColdFusion Components
(CFCs). Although we will discuss CFCs in Chapter 30, "Introducing the Spry Framework
for Ajax," for now, be aware that the option for connecting to a DSN using a CFC is made
available by clicking the CFC Query button.

8.
Click OK to close the Recordset dialog. As you'll see, the new Recordset is listed in the Bindings panel.
Note that by selecting the Bindings tab and then expanding the recordset, you can view the field names
contained within the recordset (more on this later).
Creating an Advanced Recordset
Simple recordsets can serve your needs if you are performing simple queries of all or certain fields in a
single database table. But what if you wanted to perform joins and merge two tables into one recordset?
Unfortunately, the simple method wouldn't do. Although creating advanced recordsets can become very
complex, the trade-off is flexibility, scalability, and power.
Rather than creating multiple recordsets in which you store each and every table, you can join two or more
tables into one recordset based on a common value. Take the EmployeeStore and Orders tables as
examples. Suppose that you were working in the Shipping and Receiving department and your job was to
print out a list of all orders for a specific day. If that were the case, you would need to create a recordset
that merged the EmployeeStore and Orders tables into one virtual table. Furthermore, you'd also need to
include the Employees table because all orders are related not only by products in the EmployeeStore table,
but also by the employee from the Employees table. This complex recordset can't be constructed using the
Simple recordset view (the basic Recordset dialog). Instead, you'd have to use the Advanced view.
To create a recordset using the Advanced view, follow these steps:
1.
In the Bindings panel, choose the Recordset (Query) option from the Add (+) menu. The Recordset
dialog opens.
2.
Click the Advanced button. Figure 24.22 shows that the dialog is relatively similar in design to the
Simple view, except that you can enter a SQL query manually rather than allowing Dreamweaver to
create it for you.
Figure 24.22. The Advanced Recordset dialog enables you to manually type the SQL
code, allowing for greater flexibility.
[View full size image]
Tip
The Advanced Recordset dialog also provides limited visual control over the fields you

want to include in your query. The Database Items list contains the same tree node that
the Databases panel outlines. From this list, you can choose specific tables and then click
the SELECT, WHERE, or ORDER BY buttons to include the specific fields in the SQL
statement in the SQL multiline text box.
3.
If you remember the lengthy code structure for creating SQL joins, begin typing. If you are like most
people and like to rely on programs to do the work for you, open the vectacorp.mdb file in Access and
begin a new query in Design view. Alternatively, if you're relying on a SQL Server database, open
Management Studio and begin a new View. If you're relying on a MySQL database, open MySQL Query
Browser and begin a new query.
4.
Add the Employees, Orders, and EmployeeStore tables to your query as shown in Figure 24.23.
Figure 24.23. Add the Employees, Orders, and EmployeeStore tables to the Design
view in Access.
[View full size image]
5.
Select the Employees.Name, Employees.BillingShippingAddress, Employees.BillingShippingCity,
Employees.BillingShippingState, Employees.BillingShippingZip, Orders.Quantity,
Orders.DatePurchased, EmployeeStore.ItemName, and EmployeeStore.Cost fields. Remember, we
don't need to extract everything from the database tables. Instead, we want to pull only the data from
the three tables that is relevant to the Shipping and Receiving department. Figure 24.24 shows the
complete design.
Figure 24.24. Select the fields from the tables that you want to include in your query.
[View full size image]
6.
To use the SQL code that was generated, select SQL View from the View menu. Figure 24.25 shows the
SQL code that is generated.
Figure 24.25. View the SQL code that Access generated by selecting View, SQL View.
[View full size image]
7.

Copy the SQL code, save the query as EmployeesOrders, and close Access. Don't forget to save the
query. This step is crucial for the next section.
8.
You are now free to paste the code into the SQL box in the Advanced Recordset dialog in
Dreamweaver. Figure 24.26 shows the result.
Figure 24.26. Paste the SQL code you created in Access into the SQL text box of the
Advanced Recordset dialog.
[View full size image]
9.
Type the name rsOrders into the Name text box.
10.
Select the connVectaCorp option from the Connection drop-down menu.
11.
Click the Test button to test the results. As Figure 24.27 demonstrates, a Test grid is presented with a
few prepopulated orders. You'll also notice that all the fields are combined into one virtual table
resulting from the three original tables.
Figure 24.27. Combine the contents of three tables into one recordset by using joins.
[View full size image]
12.
Click OK to close Text SQL Statement window.
13.
Click OK to close the Recordset dialog.
After you close the Recordset dialog, notice that the new recordset is listed in the Bindings panel.
Creating a Recordset from a View
In the preceding sections, you saw how to create both simple and advanced recordsets. The Simple
Recordset dialog allowed you to select a single table and work with the fields in that table in your recordset.
The Advanced Recordset dialog allowed you to paste in SQL statements created in Access's Query Designer
(Views in SQL Server's Management Studio, or MySQL Query Browser) to join two or more tables and work
with the data from multiple tables in your recordset. Recall that you saved the query you created in Access
as EmployeesOrders. Look at the saved query in Access; it might resemble Figure 24.28.

Figure 24.28. The query is saved as EmployeesOrders in Access.
Rather than opening Access every time we need to use that query and then copying the SQL statement and
pasting it into the Advanced Recordset dialog, we can use that query in Dreamweaver as is. To use the
saved query in Dreamweaver, follow these steps:
1.
Open the Advanced Recordset dialog by double-clicking the rsOrders recordset in the Bindings panel.
This action launches the Recordset dialog in the Advanced view.
2.
Select the entire SQL query and delete it from the SQL multiline text box.
3.
From the Database Items list box, expand the Views selection tree. Notice that the EmployeesOrders
view (the query you saved in Access) is shown.
4.
Choose the EmployeesOrders view and click Select. The SQL statement should resemble the one in
Figure 24.29.
Figure 24.29. Choose the query from the Views selection tree.
[View full size image]
Note
The terms view and query are essentially the same thing. Although Access and MySQL
call them queries, the standard and universal term is view. SQL Server 2005 Express
Edition and Dreamweaver refer to them as views.
5.
Click the Test button to see the result of querying the view/query. Click OK to close the Test SQL
Statement dialog. Click OK to close the Recordset dialog and save the new recordset.
Whether you are creating simple or advanced recordsets in Dreamweaver or using a saved query to create
your recordsets, be assured that the process remains relatively simple. As you have seen, even complex
joins can be achieved with ease. The next sections introduce you to methods of extracting the data from the
recordset into your application.
Working with Dynamic Elements
Now that you've been able to extract data from your data source, your next step is to structure it within

your application somehow. Dreamweaver's Server Behaviors and Bindings panels provide the capabilities
you need to get started producing dynamic elements centralized within the database but revealed by the
application.
Dynamic Text
The first step in creating dynamic applications is to try to make all your text as dynamic as possible. That is,
allow all your company's valuable information to reside in the database and then pull it out, displaying it in
dynamic pages as needed. To start creating dynamic text, begin by creating a table that will serve as the
means of organizing the data output. You can accomplish this by following these steps:
1.
Replace the text Content Goes Here on the EmployeeStore page with a new table by choosing Insert,
Table. The Table dialog appears. This table should have one row, two columns, a width of 460, and 0
for border thickness, cell padding, and cell spacing. Click OK after you enter the values. The new table
will appear on the page. Assign a width of 160 pixels to the cell on the left and then 300 pixels to the
cell on the right.
2.
Insert a nested table in the cell on the right. Give this table 3 rows, 1 column, a width of 300, and 0
for border thickness, cell padding, and cell spacing.
3.
Add the text Name, Description, and Cost in the three rows for the table you just created. You might
decide to make the text bold so that it stands out to the user. The table resembles the one in Figure
24.30.
Figure 24.30. Insert the table we'll use to structure our dynamic elements.
[View full size image]
4.
Expand the rsEmployeeStore recordset in the Bindings panel to reveal all the fields.
5.
Manually click, hold, and drag the ItemName field from the rsEmployeeStore Recordset in the Bindings
panel into the cell for the table you just created, making sure that you drop the field just next to the
Name caption.
6.

Repeat step 5 for the ItemDescription and Cost, dragging those fields into their proper cells next to
their respective captions. The result will resemble Figure 24.31.
Figure 24.31. Drag the remaining fields into their respective locations in the table.
[View full size image]
7.
Save the page and display it in the browser by pressing F12 (Option+F12). As you'll see, the first item
in our EmployeeStore database is shown on the page.
Congratulations! You've just taken your first step to working with dynamic web pages. As the chapter
unfolds, you'll learn to add dynamic images, repeating regions, pagination functionality, and more. This is
just the tip of the iceberg.
Dynamic Images
Now that you've created dynamic text within your application, you're ready to begin adding dynamic images.
The images we'll add here are not the typical static images you have used throughout the book; instead,
they will be dynamic. Remember, we added the path to the image of each item in the EmployeeStore table.
What we want to do now is dynamically show the image, based on the path provided within the ImageURL
field, on our dynamic EmployeeStore web page. To do this, follow these steps:
1.
Place your cursor in the leftmost cell (we'll use this cell to place the product's image dynamically) and
vertically align the cursor to the top of the cell by choosing the Top option from the Vert menu in the
Property inspector.
2.
Select Insert, Image. The Select Image Source dialog appears.
3.
Near the top of the Select Image Source dialog are options for selecting the image from the File
System (static) or from Data Sources (dynamic). Select the Data Sources option. The Select Image
Source dialog's interface changes to allow you to select an image path from the recordset. Select the
ImageURL field as shown on Figure 24.32.
Figure 24.32. Select the ImageURL field from the recordset.
[View full size image]
4.

Click OK. The dynamic image placeholder appears within the cell.
Save your work and test the results in the browser by pressing F12 (Option+F12). The image for the Vecta
Corp T-Shirt will now appear next to the item name, description, and cost.
Recordset Paging
Now that you've seen how easy it is to place dynamic content on a page, you'll probably want to begin
adding features that allow your users to interact with the content on your pages. Paging, for example,
enables your users to page through items in the recordset until they find the item they are looking for. For
every press of a button, your users can advance to the next record or, conversely, return to a previous
record. Developers gain certain benefits from pagination, including the following:
Load time— Rather than the page having to process multiple records at once, it processes only a
predefined set of records at a time. Records are loaded only as users advance forward to another
record.
Size constraints— By paging through a recordset, screen real estate is gained. The records are
loaded in a certain area of the page rather than all records showing continuously down the page.
Dreamweaver's pagination behaviors are located in the Add (+) menu in the Server Behaviors panel and
include the following behaviors:
Move to First Record— Returns the user to the first set of records in the recordset.
Move to Previous Record— Returns the user back one set of records.
Move to Next Record— Advances the user one set of records forward.
Move to Last Record— Advances the user to the last set of records in the Recordset.
Move to Specific Record (ASP only)— Advances or returns the user to a set of records specified by
the developer or by a parameter passed by the user.
Note
In ColdFusion, the pagination behaviors are named a bit differently. For example, ColdFusion uses
Move to First Page, Move to Previous Page, Move to Next Page, and Move to Last Page.
To begin adding pagination features to your site, follow these steps:
1.
Place your cursor just below the table that includes the dynamic data.
2.
From the Recordset Paging submenu, available by clicking the Add (+) button in the Server Behaviors

panel, select Move to Previous Record.
3.
The Move to Previous Record dialog appears, similar to Figure 24.33. Select the Create New Link:
"Previous" option from the Link menu and make sure that the rsEmployeeStore recordset is selected
from the Recordset menu. Click OK. A new dynamic Previous hyperlink is created.
Figure 24.33. Confirm the settings in the Move to Previous Record dialog.
Note
In the ColdFusion model, a Pass Existing URL Parameters check box appears in this
dialog. Enabling this check box ensures that existing URL parameters are preserved
when the user clicks the Next and Previous hyperlinks. Furthermore, ColdFusion doesn't
support direct paging of records without the use of the Repeating Region Server
behaviors first. More on this later in the chapter.
4.
Add a space after the Previous hyperlink and repeat steps 2 and 3, this time selecting the Move to Next
Record option from the Recordset Paging submenu. When you've finished adding both paging widgets,
two hyperlinks (one identified as Previous and one as Next) appear under the table, similar to Figure
24.34.
Figure 24.34. Dynamic Previous and Next hyperlinks appear under the table that
contains the dynamic image and text.
[View full size image]
Save your work and test the result in the browser by pressing F12 (Option+F12). You should be able to
navigate from the first record in the EmployeeStore database to the next record and back.
In this section, we discussed the Move to Previous Record and Move to Next Record Server behaviors. You
should feel free to experiment with the other paging server behaviors at your leisure. Dreamweaver
provides behaviors for moving to the last record and to the first record. If you're using the ASP model, you
can also include a text box that allows a user to enter the specific record to jump to.
Showing Specific Regions
Now that you have added the capability to cycle through the recordset, consider the following problem:
Users click Next until they get to the last record, and then they are abruptly stopped. They keep clicking
Next but nothing happens. The problem is that the users have reached the end of the recordset and they

cannot go any further. However, the user has no way of knowing that. To fix this, Dreamweaver provides
functionality in the form of a group of Show Region behaviors. For example, we can create a region that
contains text alerting the users that they have reached the end of the recordset. When the user reaches the
recordset's end, the region is displayed. The complete list of Show Region behaviors is given next:
Note
Although the functionality is the same across server models, the names of these server behaviors
vary slightly under the ColdFusion and PHP server models.
Show Region if Recordset Is Empty— This behavior can be useful to alert a user that an empty
result was returned from the database.
Show Region if Recordset Is Not Empty— Use this behavior when you want to populate a table of
data from results returned from a recordset if it isn't empty.
Show Region if First Record— If users are on the first set of records, you can alert them to this
fact.
Show Region if Not First Record— If users are on anything except the first set of records, you can
alert them to this fact.
Show Region if Last Record— If users are on the last set of records, you can alert them to this fact.
Show Region if Not Last Record— As the user cycles through the records, you can provide a
message. When the user is on the last set of records, a message can be displayed.
Note
In ColdFusion, the conditional behaviors are named a bit differently. For example, ColdFusion uses
Show Region if First Page, Show Region if Not First Page, Show Region if Last Page, and Show Region
if Not Last Page.
To add a Show Region behavior to your page, follow these steps:
1.
Type the text No more items to view just below the Previous and Next paging widgets. This is the
"region" that shows when the condition (the current record is the last record in the recordset) is true.
2.
With the text highlighted, select the server behavior Show Region if Last Record from the Show Region
submenu. The Show Region if Last Record dialog appears.
3.

Make sure that the rsEmployeeStore recordset is selected, and click OK.
Notice that a gray visual aid surrounds the text. This guarantees that the text contained within this region
appears only when the user reaches the last record in the recordset.
Save your work and run it in the browser by pressing F12 (Option+F12). Click the Next hyperlink until you
reach the last record. The message will appear when you reach the end of the recordset.
Again, this is only one example of the server behaviors outlined in the Show Region set of server behaviors.
Now that you have a general idea about what the Show Region server behaviors do, feel free to experiment
with the others.
Using Repeat Region
Although recordset paging is the ideal model to strive for, at times you might want to display all the records
(or a certain number of records) in the database at once. The Repeat Region behavior enables you to create
a pattern that repeats within the web page. For instance, in the EmployeeStore page, a table was created to
display the content for the image, name, description, and cost. Using the Repeat Region server behavior,
you can maintain that structure and repeat the contents for every record (or a certain number of records) in
the database. To create a repeatable region on our page, follow these steps:
1.
Select the table for which you want the content to repeat. Your selection should resemble Figure 24.35.
Figure 24.35. Select the table for which you want to create the repeatable region.
[View full size image]
2.
Select the Repeat Region option by clicking the Add (+) button in the Server Behaviors panel. The
Repeat Region dialog appears, similar to Figure 24.36.
Figure 24.36. Configure the Repeat Region dialog to show five records at a time from
the rsEmployeeStore recordset.
Save your work and test the results in the browser by pressing F12 (Option+F12). Figure 24.37 shows
records grouped in sets of five.
3.
The Repeat Region dialog enables you to enter choices regarding which recordset to create the repeat
region for as well as how you want to display the results. Make sure that the rsEmployeeStore option
is selected from within the Recordset menu. Additionally, make sure that the 5 Records at a Time

option is selected. Click OK to apply the server behavior to the selected table.
Save your work and test the results in the browser by pressing F12 (Option+F12). Figure 24.37 shows
records grouped in sets of five.
Figure 24.37. Five records at a time can be shown when you use the Repeat Region server
behavior.
[View full size image]
As you can see, you can scroll down the page to view five Vecta Corp items at a time. When you want to
view the next five items in the recordset, click the Next hyperlink that we added in the previous section.
Note
If you're working with the ColdFusion model, you probably noticed that the paging server behaviors
didn't work. Try them now. Again, ColdFusion relies on the Repeat Region server behavior for
pagination to work correctly.


Building the Employee Store Using ASP.NET
If you're reading this section, it's safe to say that you're either curious about learning how to develop .NET
applications in Dreamweaver or you're simply broadening your knowledge of the extensive functionality
available in Dreamweaver.
When I first starting using Dreamweaver UltraDev years back, I was amazed at the simplicity between the
program and the various server models that existed at the time. When I first started beta testing Visual
Studio and ASP.NET in 2000, I wondered whether Macromedia would ever include the power of Datasets,
DataGrids, and DataLists into its newest version of Dreamweaver—and if they did, how they would go about
doing it. As it turns out, they answered my questions by incorporating the easy-to-use functionality of the
ASP, ColdFusion, and PHP server models with the power of the ASP.NET server model.
If you've read the previous sections, most of this will be a review. What this section covers differently,
however, is an overview of the power exposed via Datasets, DataLists, DataGrids, and the ASP.NET
application development capabilities using Dreamweaver. Specifically, this section covers the following
topics:
Datasets
Paging

Dynamic text (object binding)
Region repeaters
Showing specific regions (conditionals)
DataGrids
DataLists
Creating a New Dataset
If you are familiar with traditional data storage and retrieval models in ASP, ColdFusion, or PHP, you are
familiar with the recordset. The recordset acts as a virtual table to store information retrieved from the
database. In Dreamweaver, ASP.NET Datasets are similar to recordsets.
Note
Dreamweaver uses Datasets as the storage mechanism for your data when working with ASP.NET.
It's important to note that, unlike a recordset in ASP, which represents only one table (even if you've
created joins, one virtual table is still represented in the recordset) from your data source, a Dataset
can contain multiple tables, known as DataTables. DataReaders—which are not covered within the
context of this book—are similar in nature to traditional recordsets in that they support only one
table from your data source.
To better understand Datasets you must first understand the main components of ADO.NET. ADO.NET is a
set of namespaces and classes that provides access to data stores. Three layers make up ADO.NET:
The Data Store— The data store represents the physical location of your data. This can be a
relational database (Access/SQL Server 2005 Express Edition/MySQL) or an XML file.
The Data Provider— The data provider connects the data store and the Dataset, filling the Dataset
with data from the data store and synchronizing changes made to the Dataset with the data store.
The Dataset— The Dataset is the container for your data and the relationships that make up your
data.
Now that you know the basic makeup of ADO.NET, you can begin to plug in all the aspects that make up
your application. Your data store consists of an OLE DB database in Access or SQL Server. Earlier in this
chapter, you learned how to create a connection using the ASP.NET server model. Now let's jump into
creating the commands and working with Datasets. To begin creating a Dataset, follow these steps:
1.
Begin by switching to the VectaCorpASPX defined site and immediately open the employeestore.aspx

file located in your Files panel.
2.
To create a Dataset, select the Dataset (Query) option from the Add (+) menu in the Bindings panel.
The Dataset dialog appears.
3.
In the Dataset dialog, enter the name dsEmployeeStore into the Name text box.
4.
Select the connVectaCorp option from the Connection drop-down menu.
5.
Choose the EmployeeStore table from the Table drop-down menu.
6.
Make sure that the All option button is selected in the Columns option button group. When you finish
making your changes, the dialog should resemble Figure 24.38.
Figure 24.38. Configure options for your Dataset in the DataSet dialog.
[View full size image]
7.
Test the Dataset by clicking the Test button. The Test SQL Statement dialog will appear with 11 Vecta
Corp items from the EmployeeStore table.
8.
Click OK to close the Test SQL Statement dialog.
9.
Click OK to close the Dataset dialog. The new Dataset is created.
You can view all the fields in the Dataset by expanding the dsEmployeeStore Dataset from the Bindings
panel. Figure 24.39 shows the results of expanding the Dataset nodes.
Figure 24.39. Expanding the Dataset enables you to see all the fields it contains.
Note
Of course, you can also create Datasets by pulling data from a prebuilt view (SQL Server 2005
Express Edition) or query (Access). For more information on how this can be done, refer to the
section, "Creating a Recordset from a View," earlier in this chapter.
Working with Dynamic Elements

Now that you have a Dataset clearly defined, your next step is to get the information out of the Dataset and
into your application. Dreamweaver's Server Behavior and Binding panels provide the functionality you need
to get started producing dynamic elements that are centralized within the database but exposed by the
application. Let's get started!
Dynamic Text
The first step in creating dynamic applications is to make all your text as dynamic as possible—that is, to
allow all your company's valuable information to reside in the database and then pull it out onto dynamic
pages as needed. To start creating dynamic text, begin by creating a table that organizes the data output.
You can accomplish this by following these steps:
1.
Replace the text Content Goes Here in the employeestore.aspx page with a new table by selecting
Insert, Table. The Table dialog appears. This table should have one row, two columns, a width of 460,
and 0 for border thickness, cell padding, and cell spacing. Click OK after you have entered these
values. After the table appears on the page, change the width of the first column to 160 pixels and
then change the width of the second column to 300 pixels.
2.
Insert a nested table in the cell on the right. Give this nested table 3 rows, 1 column, a width of 300,
and 0 for border thickness, cell padding, and cell spacing.
3.
Add the text Name, Description, and Cost in the three rows for the table you just created. You might
decide to make the text bold so that it stands out to the user. The result appears similar to Figure
24.40.
Figure 24.40. Place static text in the three fields to caption the dynamic text.
[View full size image]
4.
Expand the dsEmployeeStore Dataset in the Bindings panel to reveal all the fields in the Dataset.
5.
Manually click, hold, and drag the ItemName field from the dsEmployeeStore Dataset in the Bindings
panel into the cell for the table you just created, making sure that you drop the field just next to the
Name caption.

6.
Repeat step 5 to drag the ItemDescription and Cost fields into their proper cells next to the Description
and Cost captions. The result resembles Figure 24.41.
Figure 24.41. Drag the remaining fields into their respective locations.
[View full size image]

×