0

I used Increment & Decrement qty in Shopping Cart page

<div class="qty-ctl">    
        <button title="Decrease Qty" onclick="changeQty('<?php echo 'qty_'.$_item->getId() ?>',0); return false;" class="decrease"><?php echo $this->__('decrease') ?></button> 

<div class="qty-ctl">         
        <button title="Increase Qty" onclick="changeQty('<?php echo 'qty_'.$_item->getId() ?>',1); return false;" class="increase"><?php echo $this->__('increase') ?></button>       
    </div> 

it's working fine while increment one by one if i type 5 and press enter it automaticall reduce 1 product it shows 4 only. What is the problem

<script type="text/javascript">
            function changeQty(id,increase) {
                var qty = parseInt($(id).value);
                if ( !isNaN(qty) ) {
                    qty = increase ? qty+1 : (qty>1 ? qty-1 : 1);
                    $(id).value = qty;
                     document.getElementById("scart").submit();
                }
            }
        </script>
  • Post your changeQty function here – Akhilesh Patel Jan 13 '16 at 11:15
  • Check my updated question – user31402 Jan 13 '16 at 11:19
0

Try this code

<input name="cart[<?php echo $_item->getId() ?>][qty]" value="<?php echo $this->getQty() ?>" size="4" title="<?php echo $this->__('Qty') ?>" class="input-text qty" maxlength="12" id="cart[<?php echo $_item->getId() ?>][qty]"/>

<div class="qty-ctl">    
    <button title="Increase Qty" onclick="changeQty( <?php echo $_item->getId() ?>, 1 ); return false;" class="increase"><?php echo $this->__('increase') ?></button> 
    <button title="Decrease Qty" onclick="changeQty( <?php echo $_item->getId() ?>, -1 ); return false;" class="decrease"><?php echo $this->__('decrease') ?></button>       
</div> 
<script type="text/javascript">
    function changeQty(id, num) {
        var qty_id = "cart[" + id + "][qty]";
        var currentVal = parseInt($(qty_id).value);
        if (currentVal != NaN)
        {
            if (!e) e = window.event;
            var keyCode = e.keyCode || e.which;
            if(keyCode != 13) {
                $(qty_id).value = currentVal + num;
            }
             document.getElementById("scart").submit();
        }
    }

</script>
| improve this answer | |
  • what is size="4" – user31402 Jan 13 '16 at 11:43
  • Sorry check my updated question – user31402 Jan 13 '16 at 11:48
  • I copied it from my setup. you can remove size attribute – Akhilesh Patel Jan 13 '16 at 11:57
  • Please check my updated question that's exact script – user31402 Jan 13 '16 at 11:58
  • edited my script. try it – Akhilesh Patel Jan 13 '16 at 12:05
0

You can also try this:

<?php $_product = $this->getProduct(); ?>
<?php $buttonTitle = $this->__('Add to Basket'); ?>
<?php if($_product->isSaleable()): ?>
    <div class="add-to-cart">
        <?php if(!$_product->isGrouped()): ?>
        <label for="qty"><?php echo $this->__('QUANTITY') ?></label>
        <div class="quantity"><input type="text" name="qty" id="qty" maxlength="12" value="<?php echo $this->getProductDefaultQty() * 1 ?>" title="<?php echo $this->__('Qty') ?>" class="input-text qty" /></div>
        <?php endif; ?>
        <button type="button" title="<?php echo $buttonTitle ?>" class="button btn-cart" onclick="productAddToCartForm.submit(this)"><span><i class="fa fa-caret-right"></i> <?php echo $buttonTitle ?></span><span id="ajax_loader" style="display:none;"><i class="fa fa-spinner fa-spin"></i></span></button>
        <?php echo $this->getChildHtml('', true, true) ?>
    </div>
<?php endif; ?>
<script>
jQuery(document).ready(function($) {
    // Add to cart + and -
    jQuery("div.quantity").prepend('<i id="qtyplus" class="fa fa-angle-up plus"></i>').append('<i id="qtyminus" class="fa fa-angle-down minus"></i>');
    jQuery("#qtyplus").click(function() {
        var currentVal = parseInt(jQuery(this).next(".qty").val());
        if (!currentVal || currentVal=="" || currentVal == "NaN") currentVal = 0;
        jQuery(this).next(".qty").val(currentVal + 1); 
    });
    jQuery("#qtyminus").click(function() {
        var currentVal = parseInt(jQuery(this).prev(".qty").val());
        if (currentVal == "NaN") currentVal = 1;
        if (currentVal > 1) {
        jQuery(this).prev(".qty").val(currentVal - 1);
        }
    });
});
</script>

(remember I'm using fontawesome icons for + and - which you can replace)

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy