Django: urls in html form not working correctly

Question

I am building e-commerce website, I have a shopping cart model with items, I want the customer to select the quantity of a certain item they want to buy, this is the reason I am placing everything in a form to later grab the quantity in views.py by request.POST.getlist('quantity') and pass the data to 'Sales:checkout' . But in there I also have button to delete an individual item form the shopping cart ( Sales:delete_cart_item ) and a button for emptying the whole cart ( Sales:empty_cart ).

Now to the problem, when I press any of the latter buttons, be it Sales:delete_cart_item or Sales:empty_cart they all execute Sales:checkout , please help me figure out what I'm doing wrong

from shopping_cart.html :

<form action="{% url 'Sales:checkout' %}" method="POST">
    {% csrf_token %}
    {% for item in items %}
        <td>{{ item.item.item_name }}</td>
        <td>
            <input type="number" name="quantity" min="1" max="{{ item.item.stock_level }}">
        </td>
        <td>{{ item.item.id }}</td>
        <td>
            <a href="{% url 'Sales:delete_cart_item' item.id %}"><button>Delete row</button></a>
        </td>
    {% endfor %}
    <form action="Sales:empty_cart" method="POST">
        <button type="submit">Empty Cart</button>
    </form>
    <button type="submit">Continue to Secure Checkout</button>
</form>

please ask if you need additional details, I'm open to any way of solving this problem even if it requires to maybe rewrite a view, I don't necessarily want to place everything in a form, this is just the closest I got to doing it

Answer 1

This is because both your buttons trigger a submit of the checkout form when they are clicked.

You shouldn't put a form within another, as any submit button, even in the "inner" form, results in the "outer" form being submitted.

So I suggest you move both the "delete item" (along with its wrapping link) and the "empty cart" buttons (along with the latter's form) outside of your checkout form.