SLIDE 1
Products and Shopping Carts
E-COMMERCE
SLIDE 2 ELECTRONIC COMMERCE
E-commerce typically involves:
- Online shopping – retail to consumer
- Online marketplaces
- Electronic funds transfer
- Inventory management
- Internet marketing
- Data collection
SLIDE 3 E-COMMERCE
The developer's perspective:
- The product database
- Populating a catalog as an administrator
- Displaying products to the public
- Creating a shopping cart
- Checking inventory
- Storing orders
- Processing orders
SLIDE 4 THE ADMIN SIDE
A site administrator should have:
- A secure login
- An admin menu including a link to:
- Add a product (in this case a new gallery image)
- Complete an order
- In other situations
- Add/delete/edit employees
SLIDE 5 THE PRODUCT LIST
- The product_list.php page
queries the database to generate the list of products.
- You will be adding the View
Details buttons in the lab.
- Each button is an HTML form
with a hidden field that will transmit the image_id:
- Like the display of the images, this form is inside a loop
so the View Details form/button will be created next to each image.
SLIDE 6 THE PRODUCT LIST
created dynamically, the value of the hidden field, image_id, will correspond to the image_id for the image being displayed in that row.
- The value can be retrieved
from the product_details page just like any other form data: with the $_GET superglobal array
SLIDE 7 THE PRODUCT DETAILS PAGE
- The product_details.php file queries the database to
retrieve the data for the specific product requested.
- This example uses a form button with hidden fields to send
the product data to the cart.php page.
- Hidden form fields are not used for security purposes, but
rather to send data which may not be relevant to the user (such as an image_id)
SLIDE 8
THE CART
SLIDE 9 THE SHOPPING CART
Once the product catalog is created, a shopping cart can be implemented using sessions: $_SESSION['cart'] contains the shopping data. This example will store the imageID, the print caption, and the quantity and price of each item
- rdered in a session variable. For example:
$_SESSION['cart'] might contain:
imageID Caption Quantity Price
2 Fountains in central Tokyo 1 $59.99 3 The Golden Pavilion in Kyoto 2 $19.98
SLIDE 10 [$imgID]
['caption'] ['qty'] ['price']
… [$imgID]
['caption'] ['qty'] ['price']
THE SHOPPING CART: $_SESSION['cart']
The shopping cart is a three- dimensional array containing an array
- f data for each image in the cart.
A cart item would be referenced by: $_SESSION['cart'][$img_id] The details of a cart item would be referenced by: $_SESSION['cart'][$img_id]['caption'] $_SESSION['cart'][$img_id]['qty'] $_SESSION['cart'][$img_id]['price']
SLIDE 11
THE SHOPPING CART
A cart could also be created and saved for each user which would create an additional dimension: $_SESSION['userid']['cart']…
SLIDE 12 THE APPLICATION
cart.php
- Determines if a cart exists
- Determines the action to perform
- n the cart – options are:
- add item: 'add'
- update item: 'update'
- add an additional item:
'show_add_item'
- show cart: 'show_cart'
- empty cart: 'empty_'cart'
- Include the show_cart.php page
cart_view.php
- Displays the cart contents
- Shows subtotals and
totals
- Allows users to
- Update cart item quantities
- Add another item to the
cart
SLIDE 13 THE CART .PHP CODE
By clicking the Add to Cart button on the product_details page, the user is:
- adding an item to the cart (this will correspond
to $action == 'add' )
- the item to add and its details were sent via
$_POST:
SLIDE 14
THE CART .PHP CODE
The next step is to determine if the item already exists in the cart. If it exists, the current quantity is incremented by 1: if (isset($_SESSION['cart'][$imgID])) $_SESSION['cart'][$imgID]['quantity'] ++ ;
SLIDE 15
THE CART .PHP CODE
If the item is not in the current cart, it is added to the cart: else { // New product to the cart
//Filter the rest of the data:
$imgTitle = filter_var($_POST['caption'], FILTER_SANITIZE_STRING ); $imgPrice = filter_var($_POST['price'], FILTER_SANITIZE_NUMBER_FLOAT, FILTER_FLAG_ALLOW_FRACTION); //don't strip decimal
// Add to the cart:
$_SESSION['cart'][$imgID] = array ('caption'=> $imgTitle, 'quantity' => 1, 'price' => $imgPrice);
SLIDE 16
CART_VIEW.PHP
Once the cart is created, it can be displayed as a form where quantities can be changed.
SLIDE 17 THE CART_VIEW.PHP CODE
Notice these two lines in particular
SLIDE 18 THE CART_VIEW.PHP CODE
For each item in the cart, we want to generate the HTML to return to the browser similar to:
Source code: returned HTML
newqty[6] refers to image_id: 6 It is an array because more than one item in the cart may have a new qty
SLIDE 19
THE CART_VIEW.PHP CODE
SLIDE 20
THE CART_VIEW.PHP CODE
Output the total, display the Update (submit) button, close the form, close the table:
SLIDE 21
THE CART_VIEW.PHP CODE
The beginning of the form had the lines of code: When the form is submitted, the $_POST variables will be: $_POST['action'] (set to update) and a 2D array $_POST['newqty'] (with image_id and newqty for each item in the cart.
SLIDE 22
BACK TO CART .PHP
SLIDE 23 OTHER FEATURES OF THE CART
hyperlink to the product_list.php page
a hyperlink with the query string action=empty_cart
checkout.php page but
is something in the cart. These will be done in the lab.
SLIDE 24 BACK TO CART .PHP
- A link (which you will add in the lab) will display when a cart exists
allowing a user to click on a Show Cart button.
- The user can also choose to empty their cart which deletes the session
data for the cart only (the user remains logged in if they were before) and displays the cart_view.php page
SLIDE 25 THE CHECKOUT PROCESS
Best practice is not to store credit card data If you do, make sure it is encrypted in the database AFTER the money transaction
- 1. Enter the order into the database:
The customer's primary key (a customer must be a registered user) The order total The date of the order Shipping data if applicable
- 2. Enter the order details into the database
- 3. Clear the cart