2

I want to implement Ajax Quantity Increment and Decrement Button functionality on cart items on Minicart. I didn't find any article or any module to achieve this. as qty increment(+) and decrement(-) inside the mini cart product price and the total must change without clicking on update.Could anyone help me with it?

1

We can make it easier by adding +1 and -1 links to change the quantity of each item. We will do this with some very simple JavaScript which takes the current value and adjusts it. Once this has been done, we submit the form through JavaScript to reduce customer effort.

<?php
  <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]"/>
?>

app/design/frontend/[interface_name]/[theme_name]/template/checkout/cart/item/default.phtml

Increase by one:

<?php
  <a onclick="changeItemQuantity( <?php echo $_item->getId() ?>, 1 ); return false;" href="#"><img alt="add-arw" src="<?php echo $this->getSkinUrl('images/add-arw.png') ?>"></a>
?>

Decrease by one:

<?php
  <a onclick="changeItemQuantity( <?php echo $_item->getId() ?>, -1 ); return false;" href="#"><img alt="add-arw" src="<?php echo $this->getSkinUrl('images/add-arw.png') ?>"></a>
?>

Now the JavaScript function. We do not want it duplicated for every item so you can either put it in your theme’s JavaScript file or just below the table in the parent template -

app/design/frontend/[interface_name]/[theme_name]/template/checkout/cart.phtml

function changeItemQuantity( id , num ) {
    var qty_id = "cart[" + id + "][qty]";
    var currentVal = parseInt( $(qty_id).value );
    if ( currentVal != NaN )
    {
        $(qty_id).value = currentVal + num;
        $("products-table-basket").submit();
    }
}

enter image description here

References

  1. https://tomrobertshaw.net/2010/08/add-increase-and-decrease-quantity-buttons-to-items-in-magento-cart/
  2. https://www.magearray.com/enhanced-mini-cart.html
  3. https://community.magento.com/t5/Magento-2-x-Programming/Update-Cart-automatically-Using-Increment-and-decrement-Button/td-p/104958
  • Thanks for comment Aditya Shah but code does not works for me. – trilok kumar Oct 22 '18 at 5:53
  • This is reference you need to enhance it – Aditya Shah Oct 22 '18 at 5:58
  • Aditya Shah can you please elaborate how can I get it – trilok kumar Oct 22 '18 at 6:00
  • Okay,just a min – Aditya Shah Oct 22 '18 at 6:25
  • You can consult a way to ajax re-load block totals in cart. – Aditya Shah Oct 22 '18 at 6:26
0

You can download the extension and installed it for minicart Ajax Quantity Increment and Decrement Button.

https://github.com/kirtinariya1/MinicartAjaxQtyIncrementDecrement

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.