Building a template to display the cart

The cart_add and cart_remove views don't render any templates, but we need to create a template for the cart_detail view to display cart items and totals.

Create the following file structure inside the cart application directory:

templates/
cart/
detail.html

Edit the cart/detail.html template and add the following code to it:

{% extends "shop/base.html" %}
{% load static %}

{% block title %}
Your shopping cart
{% endblock %}

{% block content %}
<h1>Your shopping cart</h1>
<table class="cart">
<thead>
<tr>
<th>Image</th>
<th>Product</th>
<th>Quantity</th>
<th>Remove</th>
<th>Unit price</th>
<th>Price</th>
</tr>
</thead>
<tbody>
{% for item in cart %}
{% with product=item.product %}
<tr>
<td>
<a href="{{ product.get_absolute_url }}">
<img src="{% if product.image %}{{ product.image.url }}
{% else %}{% static "img/no_image.png" %}{% endif %}">
</a>
</td>
<td>{{ product.name }}</td>
<td>{{ item.quantity }}</td>
<td><a href="{% url "cart:cart_remove" product.id
%}">Remove</a></td>
<td class="num">${{ item.price }}</td>
<td class="num">${{ item.total_price }}</td>
</tr>
{% endwith %}
{% endfor %}
<tr class="total">
<td>Total</td>
<td colspan="4"></td>
<td class="num">${{ cart.get_total_price }}</td>
</tr>
</tbody>
</table>
<p class="text-right">
<a href="{% url "shop:product_list" %}" class="button
light">Continue shopping</a>
<a href="#" class="button">Checkout</a>
</p>
{% endblock %}

This is the template that is used to display the cart content. It contains a table with the items stored in the current cart. We allow users to change the quantity of the selected products using a form that is posted to the cart_add view. We also allow users to remove items from the cart by providing a Remove link for each of them.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset