Displaying Product Details

When a link is made to the detail.php page, the accompanying query string provides the page with the ItemNumber for the product and either the Category or Criterion value from the preceding search. The detail.php page uses the ItemNumber to retrieve all of the associated fields from the Product table and displays this information on the page. The Category or Criterion value is used to make a link back to the search page.

The coding for the page is relatively straight-forward. The ItemNumber is used to retrieve the related record from the Product table and to access the product picture from the Pictures folder. All of this information is then displayed on the page.

detail.php
<%
$ItemNumber = $_GET[ItemNumber]
$Category = $_GET[Category]
$Criterion = $_GET[Criterion]
%>


<html>
<head>
  <title>eCommerce Site</title>
  <link href="stylesheetEC.css" rel="stylesheet">
  <?php require("jscript.inc") ?>
</head>
<body>


<div style="position:absolute; top:0px; left:0px; width:780px;
    background-color:seagreen; color:white; padding:5px">
  <?php require("header.inc") ?>
</div>


<div style="position:absolute; top:75px; left:10px; width:175px">
  <?php require("menu.inc") ?>
</div>


<div style="position:absolute; top:75px; left:200px; width:550px">


<?php

 $conn = odbc_connect
  ('Driver={Microsoft Access Driver (*.mdb)}; DBQ=c:\inetpub\wwwroot\PHPTutorial\Ecommerce\databases\ecommerce.mdb','','');
  
  //Issue SQL SELECT Statement
		
  $sql = "SELECT * FROM Products WHERE ItemNumber = '$ItemNumber'";
  
//Execute the SQL Statement and create a recordset
		
  $rs = odbc_exec($conn, $sql);
  
//Assign Records

$ItemType = odbc_result($rs,ItemType);
$ItemProducer= odbc_result($rs,ItemProducer);
$ItemTitle = odbc_result($rs,ItemTitle);
$ItemDescription = odbc_result($rs,ItemDescription);
$ItemPrice = number_format(odbc_result($rs,ItemPrice),2);



?>


<img src="Pictures/<?php echo $ItemNumber; ?>.jpg" align="left" style="margin-right:30px">
<span class="head1"><?php echo $ItemTitle; ?></span><br/>
<span class="head4">Item Number: <?php echo $ItemNumber; ?></span><br/>
<span class="head4">Producer: <?php echo $ItemProducer; ?></span><br/>
<span class="head4">Price: $<?php echo $ItemPrice; ?></span>
<p><?php echo $ItemDescription; ?></p>

<form>
<input type="submit" class="buttonL" name="BuyButton" value="Buy Now"
	  onMouseOver="OverMouse(this)"; onMouseOut="OutMouse(this)">
</form>

<a href="search.php?Category=<?php echo $Category; ?> &Criterion=<?php echo $Criterion; ?>">
	  Back to <?php echo $Category; echo $Criterion; ?>
</a>

</div>

</body>
</html>

As we've done on previous pages, the first order of business is capturing any query strings sent to this page. In this case there are three query string values that may be sent. An ItemNumber along with either a Category or Criterion value are received. It doen't matter than one of these latter two values will be missing depending on what type of search was performed on the search.asp page. The assignments can still be made; one of the values will just be null.

$ItemNumber = $_GET[ItemNumber]
$Category = $_GET[Category]
$Criterion = $_GET[Criterion]

Within the main division of the page is where the the product information is retrieved. The search for the product record is based on the ItemNumber passed from the search page. When the record is retrieved, its values are assigned to variables for ease of handling. All but the ItemQuantiy field is stored. This field has later use, not for displaying on this page.

The picture associated with this product is displayed with an <IMG> tag, using the ItemNumber to identify the appropriate picture. Recall that all pictures are named the same as their item numbers. Then a series of headings are formatted to present the product details, along with the extended description of the product. No special formatting is used.

The "Buy Now" button appears next. This button is used by the visitor to purchase the product by adding the item to a shopping cart. For present purposes we'll ignore this button and revisit it and it's associated scripting on a later page. You might note, though, that the button has the same style characteristics as the "Go" button on the search menu. Its onMouseOver and onMouseOut event handlers tie into the JavaScript routines imported onto this page through the jscript.inc INCLUDE file.

The link at the bottom of the page returns to the previous search.asp page. Not only that, the URL passes back a query string that causes a redisplay of the previous search. (A return URL without the query string would not provide the search.php page with a Category or Criterion value. The search.php page would then default back to the home page and the previous search results would be lost.)

The query string passes both a Category and Criterion value, even though only one of the two was sent to this page. This just means that one of the query string values will be null. That situation doesn't matter to the search.php page. It re-performs the search based on whichever value is returned.

This missing Category or Criterion value also doesn't affect the

Back to "<?php echo $Category; echo $Criterion; ?>"

display inside the back link. One of these two values is null, so the one that does contain a value gets displayed; the other one doesn't.

The detail.php page has another important purpose other than displaying product information. It is from this page that the visitor shops for products, filling their shopping cart by clicking the "Buy Now" button. We'll return to a discussion of the scripting for this purpose a bit later.