Exercise 3: Constructing the initial Trip Search Results page

After the user enters the search criteria and submits the form, the results are posted to the Trip Search Results page, as the following figure shows:


This image shows a picture of the trip search results form.

The logic contained in the search results page, also known as the action page, invokes the CFC method that builds the SQL SELECT statement contained in a cfquery tag by using ColdFusion string manipulation. The action page displays the result using the cfoutput tag.

To create the Trip Search Results page:

  1. Create a blank document and save it as tripsearchresult.cfm in the my_app directory.

    Note: If you are using Dreamweaver, select Dynamic page in the Category list, and ColdFusion in the Dynamic Page list.

  2. Enter the following code, or do the steps in the Let Dreamweaver do it section.
    <cfinvoke 
    	component="cfdocs.getting_started.my_app.components.gettrips" 
    	method="getTripsFromForm"
    	returnvariable="TripResult">
    </cfinvoke>
    
  3. Enter or copy and paste the following code after the closing cfinvoke tag:
    <html>
    <head>
    <title>Trip Maintenance - Search Results</title>
    </head>
    <body>
    	<img src="images/tripsearchresults.gif">
    	<table border="0" cellpadding="3" cellspacing="0">
    		<tr bgcolor="Gray">
    			<td>	Trip Name
    			</td>
    			<td>	Location
    			</td>
    			<td>	Departure Date
    			</td>
    			<td>	Return Date
    			</td>
    			<td>	Price
    			</td>
    		</tr>
    		<cfoutput query="TripResult">
    			<tr>  
    				<td>	#tripName#
    				</td>
    				<td>	#tripLocation#
    				</td>
    				<td>	#departureDate#
    				</td>
    				<td>	#returnDate#
    				</td>
    				<td>	#price#
    				</td>
    			</tr>
    		</cfoutput>
    </table>
    </body>
    </html>
    
  4. Save the file.

Let Dreamweaver do it

As you have in previous exercises, you can let Dreamweaver generate the code to invoke the method.

To invoke the method using Dreamweaver:

  1. Click the Components tab.
  2. Click the + button next to cfdocs.getting_started.my_app.components.
  3. Click the + button next to gettrips.
  4. Select query getTripsFromForm() and drag it to the top of the triplisting.cfm file.
  5. Change the value of returnvariable to be the name of the query, TripResult, as follows:
    returnvariable="TripResult"
    
  6. Return to Step 3 in the To create the Trip Search Results page: section.

Reviewing the code

The following table describes the code used to build the tripLocation WHERE subclause:

Code

Explanation

<cfset WhereClause = " 0=0 "> 

The cfset tag initializes the WhereClause variable to hold the WHERE clause to be constructed. The initial value is set to " 0=0 " so that the WHERE clause has at least one subclause in case the user enters no search criteria.

<cfif Form.tripLocationValue GT "">			

The cfif tag tests to see if the user entered anything in the Value input field for tripLocation criterion.

SELECT tripName,  tripLocation, 
departureDate, returnDate, price, tripID 
FROM trips
WHERE #PreserveSingleQuotes(WhereClause)#

SQL query to execute. The PreserveSingleQuotes function ensures that quotation marks are passed to the database server as intended.

The preceding code only builds the tripLocation subclause. In the following exercise, you will add code for the other two columns that you can query, departureDate and price.