Magento – Removing Items from the cart doesn’t update the ajax cart

This is easily done, but the javascript functions that trigger the minicart show/hide will "break", since you are reloading content into the DOM, which was instantiated at page load or document ready.

I'll show you how to achieve the result first, then we'll tackle the javascript issue.

Answering The Question

The block you want is called minicart_head, so your layout code in the controller addAction should be as follows:

if (!$this->_getSession()->getNoCartRedirect(true)) {
    if (!$cart->getQuote()->getHasError()){
        $message = $this->__('%s was added to your shopping cart.', Mage::helper('core')->htmlEscape($product->getName()));
        $response['status'] = 'SUCCESS';
        $response['message'] = $message;
        $this->loadLayout();
        $minicart = $this->getLayout()->getBlock('minicart_head')->toHtml(); // <-- here's the block
        $response['minicart'] = $minicart;
    }
}

You can use the minicart data to replace the DOM object from your javascript function.

try {
    jQuery.ajax({
        url: url,
        dataType: 'json',
        type : 'post',
        data: data,
        success: function(data){
            var json =  eval(data);
            jQuery('#ajax_loader').hide();
            if (jQuery('.header-minicart')) {
                jQuery('.header-minicart').html( json.minicart );
            }
        }
    });
} catch (e) {
}

If you observe the DOM, using Web Inspector, for example, you will see that the content updates now via AJAX, but your show/hide feature will no longer work, since the javascript that acts on the #header-cart link has not been triggered for the new content.

Javascript Issue

By using jQuery's .on(), the theme developers at magento are on the right track (although they use a convoluted procedure to update the cart via AJAX).

In order for the show/hide feature to work, you need to use .on() delegation, or bubbling. In app.js, find the following:

File: app/skin/frontend/rwd/default/js/app.js

var skipContents = $j('.skip-content');
var skipLinks = $j('.skip-link');

skipLinks.on('click', function (e) {
    ...
}

And replace it as follows:

var skipContents = $j('.skip-content');
var skipLinks = $j('.skip-link');

$j('.skip-links').on('click', '.skip-link', function (e) {
    ...
}

And there you have it. Now your content reloads via AJAX, and the links still work after the cart changes.

  $( '#cartqty' ).html('<?php echo $this->helper('checkout/cart')->getSummaryCount(); ?>'); not ajax call .

1. Call an ajax on button click to new url.

2. Get data from that New Url.so you need to new Action on exit any controller or create new controller and get data .

<script> $( '.product-add-btn' ).click(function() { new Ajax.Request(url, { method:'get', onLoading:function(){ }, onSuccess: function(transport) { if (200 == transport.status){ var response = transport.responseText.evalJSON( ); $( '#cartqty' ).html(response.count ); }else{ alert('Something went wrong...'); } }, onFailure: function() { alert('Something went wrong...'); } }); }); </script>

Need to create a controller by create new module:

<?php
class Amit_Custommodule_IndexController extends Mage_Core_Controller_Front_Action{
public function indexAction(){
    $this->helper('checkout/cart')->getSummaryCount();
    $result=array();
    $result['count']=this->helper('checkout/cart')->getSummaryCount();
    $this->getResponse()->setHeader('Content-type','application/json',true);
    $this->getResponse()->setBody(Mage::helper('core')->jsonEncode($result));
    }
}

Full module:

• First of all create module control file Module name as Amit_Custommodule.xml at app/etc/modules/.

Code:

<?xml version="1.0"?>
<config>
    <modules>
        <Amit_Custommodule>
            <codePool>community</codePool>
            <active>true</active>
        </Amit_Custommodule>
    </modules>
</config>

• Path Of config.xml is app/code/community/Amit/Custommodule/etc

Code:

<?xml version="1.0" ?>
<config>
    <modules>
        <Amit_Custommodule>
            <version>1.0.0</version>
        </Amit_Custommodule>
    </modules>

    <frontend>
        <routers>
            <custommodule>
                <use>standard</use>
                <args>
                    <module>Amit_Custommodule</module>
                    <frontName>custommodule</frontName>
                </args>
            </custommodule>
        </routers>
    </frontend>
</config>

• IndexController.php path is app/code/community/Amit/Custommodule/controllers/

Code:

<?php
class Amit_Custommodule_IndexController extends Mage_Core_Controller_Front_Action{
public function indexAction(){

    $result=array();
    $result['count']=Mage::helper('checkout/cart')->getSummaryCount();
    $this->getResponse()->setHeader('Content-type','application/json',true);
    $this->getResponse()->setBody(Mage::helper('core')->jsonEncode($result));
    }
}

And script:

<script>
$( '.product-add-btn' ).click(function() {
     new Ajax.Request('<?php echo $this->getUrl("custommodule/index/index")?>', {
            method:'get',
             onLoading:function(){    },
            onSuccess: function(transport) {
              if (200 == transport.status){ 
                     var response = transport.responseText.evalJSON( );
                       $( '#cartqty' ).html(response.count );
                }else{
                    alert('Something went wrong...');
                }
              },
            onFailure: function() { alert('Something went wrong...'); }
            });
});
</script>