Magento quantity increments using jQuery

If we need to add increments in the quantity then we can follow the below simple method .
First of all we need to add the jQuery code. Add the following to one of your jQuery js files (or create a new one if that’s your thing).

jQuery("div.quantity").append('<input type="button" value="+" id="add1" class="plus" />').prepend('<input type="button" value="-" id="minus1" class="minus" />');
        jQuery(".plus").click(function()
        {
            var currentVal = parseInt(jQuery(this).prev(".qty").val());
            
            if (!currentVal || currentVal=="" || currentVal == "NaN") currentVal = 0;
             
            jQuery(this).prev(".qty").val(currentVal + 1);
        });
     
        jQuery(".minus").click(function()
        {
            var currentVal = parseInt(jQuery(this).next(".qty").val());
            if (currentVal == "NaN") currentVal = 0;
            if (currentVal > 0)
            {
                jQuery(this).next(".qty").val(currentVal - 1);
            }
        });

Then Move the file app/design/frontend/base/default/template/catalog/product/view/addtocart.phtml into your theme directory if you haven’t already, open it up and look for line 34. You should see the code for the input which will look something like:

<input type="text" name="qty" id="qty" maxlength="12" value="<?php echo $this->getMinimalQty($_product) ?>" title="<?php echo $this->__('Qty') ?>" class="input-text qty" />

Change the AS BELOW

<div class="quantity">
<input type="text" name="qty" id="qty" maxlength="12" value="<?php echo $this->getMinimalQty($_product) ?>" title="<?php echo $this->__('Qty') ?>" class="input-text qty" />
</div>
Source : http://jigowatt.co.uk/blog/magento-quantity-increments-jquery-edition/

Leave a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.