Shopping Cart - Sample web app   
Demo user guide  
  • Product list

Product list

The section displays a detailed list of products in your shopping cart. It also allows to manage the items in the cart -  to change their quantity or to remove them completely.
Product list

Remove item

1. Remove item
Click the icon to remove the product from your cart completely. Note, this action cannot be undone.
To add the product back to the order you must find it in the store and add it to cart again.
Note, this is a demo web page and if you click the icon nothing will actually happen.

Image & title

2. Image & title
The section contains the product name and its image to quickly remind you what you are going to buy.

Price, quantity & total

3. Price, quantity & total
The section shows the product price per item, the quantity of items in your shopping cart, and actual subttotal for each product.
Press Update Cart button to recalculate the total order price.
The volume discount of 10% is available for each product and will be applied if its quantity is equal 10 or greater.
This is a kind of a bonus for those who reads the documentation. Moreover, a discount of 25% will be applied if a product's quantity is 25 or more.
We hope you are lucky enough to discover other discount offers on your own. :)

Update Cart

4. Update Cart
Press this button to recalculate the subtotals for all products in the cart and the total order price.
Maybe we should implement an automatic recalculation, but we'd like to keep the user interface a bit complicated to justify the need of context help and to demonstrate how it works.
Made with help of Dr.Explain