Introduction to Php and Mysql - Exercise 4: Building a Shopping Cart for Bldc

INTRODUCTION TO PHP AND MYSQL - EXERCISE 4: BUILDING A SHOPPING CART FOR BLDC

Throughout this course, you will be developing the PHP-driven web application of the fictitious Bedford Laundry Detergent Company. BLDC sells two primary products -HotWava (a liquid detergent) and WavaBeans (a powdered detergent).

In the exercise, you will be working within the IntroductiontoPHP folder. If you have not already done so, create a new Dreamweaver site pointing to the IntroductiontoPHPfolder. You will need to add Remote Info and Testing Server information, and create a new folder on the server Introduction_to_PHP to which you will publish.

In this exercise you will be modifying the file ex04-cart-temp.phpto complete the code for a shopping-cart application that uses Session variables. When the user requests ex04-cart-temp.phphe will be able to place multiple quantities of both WavaBeans and HotWava laundry products in a virtual ShoppingCart. The page will also display the current selected amounts of these products, and allow the user to withdraw products from the cart.

The original ex04-cart-temp.phpfile is shown below:

Requesting the completed ex04-cart-temp.php will display this page:

Submitting the completed form will request ex04-set-temp.php which will contain statements that modify and store the appropriate Session variables.

Clicking on Return to the Shopping Cart page will return the user to the main ShoppingCartpage.

Clicking the empty link on the main ShoppingCart page will request ex04-resetcart-temp.php which will contain the code that ends the Session.

To complete this exercise:

Open ex04-cart-temp.php for editing within Dreamweaver.

Complete the sections highlighted in the code below:

<!--

Activate session handling.

Check for the existence of the session variables wavabeans and hotwava.

If they do not exist, initialize them at 0

-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

<html xmlns="

<head>

<title>Shop For WavaBeans and HotWava Online</title>

</head>

<body>

<?php include("header.php"); ?>

<p<img src="images/wavas.gif" width="160" height="176" align="right" alt="Wava Laundry Products!" />Welcome to the <strong class="header">BLDCShopping Center</strong>, where you can shop for <strong>WavaBeans</strong> and <strong>HotWava</strong> laundry products online! Your <strong class="header">Shopping Cart</strong> currently contains:</p>

<p<strong<!-- Print out the wavabeans session variable here --</strong> boxes of <strong>WavaBeans</strong>.<br />

<strong<!-- Print out the hotwava session variable here --</strong> jugs of <strong>HotWava</strong>.</p>

<p>If you would like to change your order, please make your changes below and submit the form. </p>

<p>Please

<option value="increase">increase </option>

<option value="decrease">decrease </option>

</select>

my order of <strong>WavaBeans</strong> by <input type="text" name="wbamount" /> boxes.

</p>

<p>Please

<option value="increase">increase </option>

<option value="decrease">decrease </option>

</select>

my order of <strong>HotWava</strong> by <input type="text" name="hwamount" /> jugs.

</p>

<p>

</p>

</form>

<p>Please <a href="ex04-resetcart-temp.php">empty</a> my shopping cart!</p>

<?php

include("footer.php");

</body>

</html>

Open ex04-set-temp.php for editing within Dreamweaver.

Complete the sections highlighted in the code below:

<!-- Make sure the user has filled out the form by seeing if the wbamount and hwamount form fields are set. if either of them is not, redirect the user to the form.

Activate session handling.

Save the form fields into variables for easy use later ie. create a variable called wbchange that will contain the value of the wbchange form element. Do this for all four form fields.

-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

<html xmlns="

<head>

<title>Shop For WavaBeans and HotWava Online</title>

<!--

b {color: red}

-->

</style>

</head>

<body>

<?php include("header.php");?>

h2 class ="header">Fill Your Shopping Cart!</h2

<p>BLDC has adjusted the contents of your Shopping Cart.<br /> Return to the <a href="ex04-cart-temp.php">Shopping Cart page</a> where more wonderful BLDC products await!</p>

<?php

include("footer.php");

</body>

</html>

Open ex04-resetcart-temp.php for editing within Dreamweaver.

Complete the sections highlighted in the code below:

<!--

Activate session handling.

Destroy the current session.

-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

<html xmlns="

<head>

<title>Empty My Shopping Cart</title>

</head>

<body>

<?php include("header.php") ?>

<h3 class="header" style="width:100%;text-align:center;">Empty Your Shopping Cart</h3>

<p>Your <strong class="header">Shopping Cart</strong> has been emptied.</p>

<p>Click here to return to the <strong class="header"<a href="ex04-cart-done.php">Shopping Cart</a</strong> page.</p>

</body>

</html>

If you are done early …

This ShoppingCart allows the user to select negative quantities of WavaBeans and HotWava. BLDC cannot allow this! Modify your code so that if the user tries to remove from the shopping cart more of either product than it currently contains, the quantity of that product will be automatically set to 0.

A Possible Solution to Exercise 4

As contained in ex04-cart-done.php:

<?php

session_start();

if (!isset($_SESSION["wavabeans"])) $_SESSION["wavabeans"] = 0;

if (!isset($_SESSION["hotwava"])) $_SESSION["hotwava"] = 0;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

<html xmlns="

<head>

<title>Shop For WavaBeans and HotWava Online</title>

</head>

<body>

<?php include("header.php"); ?>

<p<strong<?php echo $_SESSION["wavabeans"]; ?</strong> boxes of <strong>WavaBeans</strong>.<br /<strong<?php echo$_SESSION["hotwava"]; ?</strong> jugs of <strong>HotWava</strong>.</p>

<p>If you would like to change your order, please make your changes below and submit the form. </p>

<p>Please

<option value="increase">increase </option>

<option value="decrease">decrease </option>

</select>

my order of <strong>WavaBeans</strong> by <input type="text" name="wbamount" /> boxes.

</p>

<p>Please

<option value="increase">increase </option>

<option value="decrease">decrease </option>

</select>

my order of <strong>HotWava</strong> by <input type="text" name="hwamount" /> jugs.

</p>

<p>

</p>

</form>

<p>Please <a href="ex04-resetcart-done.php">empty</a> my shopping cart!</p>

<?php

include("footer.php");

</body>

</html>

As contained in ex04-set-done.php:

<?php

if ( !isset($_POST["wbamount"]) || !isset($_POST["hwamount"]) )

header("Location: . $_SERVER['HTTP_HOST'] .dirname($_SERVER['PHP_SELF']) . "/ex04-cart-done.php");

session_start();

$wbchange = $_POST["wbchange"];

$wbamount = $_POST["wbamount"];

$hwchange = $_POST["hwchange"];

$hwamount = $_POST["hwamount"];

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

<?php

if ($wbchange == "increase")

$_SESSION["wavabeans"] += $wbamount;

else

$_SESSION["wavabeans"] -= $wbamount;

if ($wbchange == "increase")

$_SESSION["hotwava"] += $hwamount;

else

$_SESSION["hotwava"] -= $hwamount;

<html xmlns="

<head>

<title>Shop For WavaBeans and HotWava Online</title>

<!--

b {color: red}

-->

</style>

</head>

<body>

<?php include("header.php");?>

h2 class = "header">Fill Your Shopping Cart!</h2

<p>BLDC has adjusted the contents of your Shopping Cart. <br />Return to the <a href="ex04-cart-done.php">Shopping Cart page</a> where more wonderful BLDC products await!</p>

<?php

include("footer.php");

</body>

</html>

As contained in ex04-resetcart-done.php:

<?php

session_start();

session_destroy();

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

<html xmlns="

<head>

<title>Empty My Shopping Cart</title>

</head>

<body>

<?php include("header.php") ?>

<h3 class="header" style="width:100%;text-align:center;">Empty Your Shopping Cart</h3>

<p>Your <strong class="header">Shopping Cart</strong> has been emptied.</p>

<p>Click here to return to the <strong class="header"<a href="ex04-cart-done.php">Shopping Cart</a</strong> page.</p>

</body>

</html>

A - Introduction to PHP and MySQL - Exercise 4 - Building a Shopping Cart for BLDC

Page 1 of 11Version 1