The option of specifying Quantity in Add to Basket Form

[Gaurav Wadhwani]

My website has products with minimum purchase quantity set. I need a way to provide the users to specify the quantity they need to purchase. So far, I was assuming that the add to basket form accepts quantities, which is why I just included a quantity field in the form:

<div class="qnt-holder">
 <div class="le-quantity">
 {% if session.availability.is_available_to_buy %}
 <form id="add-to-cart-form" name="add-to-cart-form" action="{% url 'basket:add' pk=product.pk %}" method="post">

 <a class="minus" href="#reduce"></a>
 <input name="quantity" id="quantity" readonly="readonly" type="text" value="1" />
 <a class="plus" href="#add"></a>
 {% csrf_token %}
 </form>
 {% endif %}
 </div>
 <a id="addto-cart" href="javascript: document.forms['add-to-cart-form'].submit();" class="le-button huge">add to cart</a>
</div><!-- /.qnt-holder -->

However, when the quantity is > 1, the whole process fails with Invalid CSRF token. 

How do I achieve this?