Auto update cart quantity when change quantity
First edit the cart template /app/design/frontend/{package}/{theme}/template/checkout/cart.phtml
and add an id on the form element for easier access. Let's say you add 'id="cart-form"';
Now edit the templates that render the cart items:
- app/design/frontend/{package}/{theme}/template/checkout/cart/item/default.phtml
- app/design/frontend/{package}/{theme}/template/downloadable/checkout/cart/item/default.phtml
and on the <input>
element with the name cart[<?php echo $_item->getId() ?>][qty]
add this:
onchange="$('cart-form').submit()"
But I don't recommend doing this. It's really annoying for the users. (at least for me).
Assuming your site has jQuery included in no-conflict mode, here's a way of doing this asynchronously (much less annoying!).
jQuery(document).ready(function(){
jQuery('#shopping-cart-table')
.on(
'change',
'input[name$="[qty]"]',
function(){
var form = jQuery(jQuery(this).closest('form'));
// we'll extract the action and method attributes out of the form
// kick off an ajax request using the form's action and method,
// with the form data as payload
jQuery.ajax({
url: form.attr('action'),
method: form.attr('method'),
data: form.serializeArray()
});
}
);
});
I should point out that this makes the following assumptions:
- Your shopping cart lives within an element with the id of shopping-cart-table
- Your input fields for quantity have a name attribute that ends with [qty]
It should be easy to adjust the selectors in the code on lines 2 and 5 respectively to match your circumstances.