Performing a Simple Search

A simple search to Dreamweaver MX is a search that looks for data based on a single criterion. For example, looking for all congressional members who have the last name of Jackson or all car models made in 1973 are searches that use a single qualifier—Jackson in the former and 1973 in the latter—to filter the data. Let's build a simple search that lets us look for records with a last name of Mouse.

A Simple Search Form

Start with an HTML form that contains a text field into which the user can type the name for which they're looking. Figure 22.1 shows our simple page, which we're calling Search_Simple.asp. You'll need to specify an action for your HTML form. We're entering Search_Simple_Results.asp as the action for ours. Add a Submit button to your HTML form and save your page. We'll create the actual page named Search_Simple_Results.asp next.

Figure 22.1: A simple form starts our search engine.

A Simple Search Form Action Page

The action page for our search results is where Dreamweaver MX does the actual work of searching for and displaying our requested data. It accomplishes this through the use of the Recordset Server Behavior. To start building this page, create a new, blank, dynamic ASP (Active Server Pages) page and save it as Search_Simple_Results.asp.

Adding a Recordset

To this search page, we're going to add a recordset, as we've done before. But we're going use the Filter option to grab only the records that match the criteria we enter into our search page's LastName text field. So click the Server Behaviors tab on the Application panel, click the plus sign (+), and choose RecordSet(Query) from the menu to open the Recordset dialog box, similar to that in Figure 22.2. We've already filled out the options in our example, so let's review them.

Figure 22.2: The Recordset dialog box effectively acts as our search filter.

You need to give this recordset a name. We've entered SimpleSearchResults in the Name: field. The Connection drop-down list box contains the database connection you want to use. We assume you're creating this search engine using an already-defined site that has a database connection assigned to it. If you don't have a database connection, click Define and create a database connection to the database you want to use. For more information on creating your database connection, see Chapter 10.

Once you've specified a database connection, the Table drop-down list box will fill with the tables contained within that database. Select the table upon which you want to perform a search. As you can see, we're choosing the tblBorrowers table.

Next, you choose the table columns you want the search to return. We're interested in seeing all the table columns, so we're going with the default of All. If you only want a few of the columns returned, you can click Selected and then select the columns in the list by pressing Ctrl and clicking the column name you want to see.

Setting the Filter

Filter, in this case, is the magic wielder for our search. By specifying a filter, we tell Dreamweaver MX to return only the records that match our previous page's form search field. Since we're interested in searching by LastName, in the first Filter box, we're going to choose LastName from the list of column names. In the second Filter box, we're going to choose the equal sign (=) since we want only the records that match exactly the name we're entering. We could choose any of the logical operators or three special operators from this list. Table 22.1 lists and explains the special operators.

Table 22.1: SPECIAL OPERATORS

Operator	Purpose
Begins with	Finds records that begin with the criteria we enter. For example, an entry of Mic would find Mickey, Michael, Michelle, and so forth.
Ends with	Finds records that end with the criteria we enter. For example, an entry of en would find Lauren, Karen, Darren, and so forth.
Contains	Finds records that contain the criteria we enter. For example, an entry of am would find Sammy, Tammy, James, and so forth.

The third Filter box is a drop-down list that lets us choose the type of variable we want to use as the filter. We can choose from Cookie, URL Variable, and so forth, but for our purposes here, we want to use a Form Variable, so choose Form Variable from the list.

The fourth Filter box is where you put the name of the variable you chose in the third box. So here, we enter cLastName, which is the name of our form field from the prior page. Naturally, you'll want to enter the name of your form field if it doesn't match ours.

The Sort drop-down list box lets you specify a column on which to sort the data. You can choose whether the data should be sorted in ascending or descending order. Since we're only looking for records with a last name equivalent to what we enter, we're already filtering our records by last name. Therefore, to sort our records in proper order, we can sort on the FirstName field.

Now that we've got our search complete, we need a place in which to display it. Click OK, and let's add a Dynamic Table to this form.

Adding a Dynamic Table

If you recall from Chapter 19, Dreamweaver MX includes an Application object called Dynamic Table that automatically creates a repeating region and table to display the results from a query. We're going to use one of those to display our search results. Follow these steps:

1. Choose Insert ® Application Objects ® Dynamic Table, as we did in Figure 22.3, to open the Dynamic Table dialog box, as shown in Figure 22.4.

   
   Figure 22.3: Add a Dynamic Table to display the search results.

2. Choose the recordset name you created earlier from the Recordset drop-down list box. This may already be chosen for you.

3. Set your table options, such as how many records the table should display at once, the border, and cell spacing and padding, and then click OK. Dreamweaver MX should add to your page a table, complete with repeating regions, similar to that you can partially see in Figure 22.5.

4. Save your page, and open the search page in your browser.

   
   Figure 22.4: Set the options for your Dynamic Table.

Performing the Search

When you open your search page in a browser, you should see something similar to Figure 22.6, which shows our version. If you're using our sample database and search for "mouse" you should get results similar to that shown in Figure 22.7. Our search yields the records with the last name of Mouse, and, indeed, they're sorted by the first name.

Figure 22.5: Dreamweaver MX has added to our page a table to display the record list.

Figure 22.6: Our simple search form

Figure 22.7: We found all the records matching "Mouse".

It would be nice to repeat what the user searched for, wouldn't it? We should probably include a statement that reminds the user about the search criteria they used to get these results. And notice the missing table cells under Phone? Let's get rid of those too.

Tweaking the Results Display

Let's go back to our search results page. First, let's add a search criteria form variable to our bindings so that we can display it to the user. Follow these steps:

1. Click the Bindings tab on the Applications panel, click the plus sign (+), and then choose Request Variable to open the Request Variable dialog box.

2. From the Type drop-down list box, select Request.Form, since this is how ASP refers to form variables.

3. In the Name box, enter cLastName (or whatever you named your search form text field), as we did in Figure 22.8.

   
   Figure 22.8: When creating ASP pages, Dreamweaver MX offers Request.Form variables as a new binding type.

4. Click OK, and Dreamweaver MX adds the Request binding to your Bindings panel, as you can see in Figure 22.9.

   
   Figure 22.9: We've added a new variable binding to our page.

5. Add some text such as "You searched on," and drag the form variable from the Bindings panel onto the appropriate space on your page, as we did in Figure 22.10. Now let's prevent empty table cells from breaking the flow of the table.

   
   Figure 22.10: We're adding a search reminder for the user.

6. Add a nonbreaking space to each table cell, at the end of the variable. You can either enter   in the Code window at the appropriate place, or you can choose the nonbreaking space character from the Characters tab on the Insert bar.

7. Save your page, and you should see a modified search results screen similar to that in Figure 22.11.

   
   Figure 22.11: Our modified search results page

Note 

Since we're using ASP to create our search, we'll be choosing Request variables here. If we were creating a different type of dynamic page, a ColdFusion page, for instance, we'd see Form Variable. Keep in mind that Dreamweaver MX changes to reflect names that are appropriate for the type of dynamic page you're creating.