What e-commerce site would be complete without a shopping cart? Let's see how we can add one to our e-commerce prototype. We'll start out with a very simple implementation, and we'll build on it in the next chapter. First, we'll add an add-to-cart
button and form to the product page (/ch6/product-cart.html
):
<form method="post" action-xhr="/ch6/add-to-cart.php" target="_top"> <input type="hidden" name="price" value="9.99"> <input type="hidden" name="product_id" value="tshirt-1"> <input type="hidden" name="product_name" value="T-Shirt: Super Pouvoir"> <input class="btn" type="submit" value="Add to cart"> </form>
For now, we'll include price
and product_id
as hidden fields in our form (in a real application with a proper backend, you might only need to pass the product_id
).
When the button is clicked, the form will submit to the server endpoint, and the item will be added to the cart. But how will the server know...