Web Analytics

Fill the form & Get Installation Support

Magento 2: Update cart using ajax when quantity change

Here we are discussing to update the cart without clicking the Update Cart Button.
Or we can say ajax cart update.

I have created a custom module to implement such functionality.
Here I have used MageMonkey as vendor and AutoUpdateCartAjax as the module name.

Please follow the below steps:
1. Create MageMonkey/AutoUpdateCartAjax directories in app/code.

2. Create registration.php file at app/code/MageMonkey/AutoUpdateCartAjax and add following code:

3. Create module.xml file at app/code/MageMonkey/AutoUpdateCartAjax/etc/ and add following code:

4. Create checkout_cart_index.xml file at app/code/MageMonkey/AutoUpdateCartAjax/view/frontend/layout and add following code:

5. Create js.phtml file at app/code/MageMonkey/AutoUpdateCartAjax/view/frontend/templates and add following code:

6. Create cartQtyUpdate.js file at app/code/MageMonkey/AutoUpdateCartAjax/view/frontend/web/js and add following code:

7. Create requirejs-config.js file at app/code/MageMonkey/AutoUpdateCartAjax/view/frontend/ and add following code:

8. Run below commands to enable this custom module.

php bin/magento setup:upgrade
php bin/magento cache:clean
php bin/magento cache:flush

Now, you can check your cart page. If you increase or decrease quantity, it will auto-update cart total and mini cart.

CONTACT US to get Magento programming solutions by hiring a certified Magento expert.

Fill the below form if you have any Magento programming need.

    Recent Articles

    Author Info

    Author Image

    Magento Certified Developer

    Hire V. Brahmbhatt

    Get a Free Quote

      /* second popup */

      Connect With Us