Magento : Quick View Add to Cart not Showing Product in Minicart Witout Refreshing Page

Question

I am using custom quick view with ajax. When I add product in cart using this quick view, mini cart show count of product but its not show product there. After refreshing page product show in minicart.

Here is my code used to Ajax add to cart function.

     function addtoCart(miniurl){
        var miniurl=miniurl;
        jQuery("#success_message").show();
        jQuery("#success_message").html('<img src="/demo/media/images/loading-round.gif" alt="Loading..." width="77" height="73">');
        var url;
        url = jQuery('#product_addtocart_form').attr('action');

        url = url.replace("checkout/cart", "ajax/index"); // New Code
        if ('https:' == document.location.protocol) {
            url = url.replace('http:', 'https:');
        }
        var data = jQuery('#product_addtocart_form').serialize();
            data += '&isAjax=1';
        try {
            jQuery.ajax({
                url:url,
                dataType:'json',
                type:'post',
                data:data,
                success:function (data) {
                    if(data.status=="SUCCESS"){
                jQuery("#success_message").html(data.message);
                 minicartAjax(miniurl);
                 var qty = jQuery("#qty").val();
                 var curqty = jQuery(".header-minicart .count").html();
                 var newqty=parseInt(qty)+parseInt(curqty);
                 jQuery(".header-minicart .count").html(newqty);
                //jQuery(".header-minicart .label").html('Cart ('+newqty+')');

                    }

                }

            });
        } catch (e) {

        }
    }
    function minicartAjax(url){
    var url = url;
    //alert(url);
    jQuery.ajax({
        url: url,
        dataType: 'json',
        success: function(data){
            var response = data.responseText.evalJSON();
            jQuery(".header-minicart").update(response.minicart);
            //jQuery('#header-cart').html(data.mini_cart);
            alert(response.minicart);
        }
    });
} 

Custom controller for add to minicart

app/code/local/Minicart/Quick/controllers/minicartcontroller.php

     <?php
class Minicart_Quick_MinicartController extends Mage_Core_Controller_Front_Action{
    public function add_to_minicartAction()
    {
        Mage::log("control get",null,"mini.log");
        $this->loadLayout();
        $layout = Mage::getSingleton('core/layout');
        $block = $layout->getBlock('cart_sidebar');
        $html = $block->toHtml();
        $this->getResponse()->setBody(Mage::helper('core')->jsonEncode(array('minicart' => $html)));
    }
}

app/code/local/Minicart/Quick/etc/config.xml

    <?xml version="1.0"?>
  <config>
     <modules>
        <Minicart_Quick>
          <version>0.1.0</version>
        </Minicart_Quick>
     </modules>
     <frontend>
       <routers>
          <routeurfrontend>
              <use>standard</use>
              <args>
                 <module>Minicart_Quick</module>
                 <frontName>Quick</frontName>
              </args>
           </routeurfrontend>
       </routers>
    </frontend>
</config>

Here is method that I passed custom controller url to addtocart ajax function

<?php $miniurl = Mage::getUrl('quick/controllers/add_to_minicart');?>
<button type="button" title="Add to Cart" class="button btn-cart" id="addto-cart" onClick="addtoCart('<?php echo $miniurl;?>')">Add to Cart</button>

Answer 1

Rename your file minicartcontroller.php to MinicartController.php and update content

<?php
class Minicart_Quick_MinicartController extends Mage_Core_Controller_Front_Action{
    public function add_to_minicartAction()
    {
        $block = $this->getLayout()->createBlock('checkout/cart_sidebar')->setTemplate('checkout/cart/minicart/items.phtml');
        $this->getResponse()->setBody(Mage::helper('core')->jsonEncode(array('minicart' => $block->toHtml())));
    }
}

Now update your code

<?php $miniurl = Mage::getUrl('quick/controllers/add_to_minicart');?>

to

<?php $miniurl = Mage::getUrl('Quick/minicart/add_to_minicart');?>

Update your minicart function

function minicartAjax(url){
    var url = url;
    alert(url);
    jQuery.ajax({
        url: url,
        dataType: 'json',
        success: function(data){
            var response = data.responseText.evalJSON();
            $("YOUR_MINICART_DIV").update(response.minicart);
            alert("hii");
        }
    });
} 

Answer 2

In addtoCart funtion it seems that you have only update the quantity of mini cart but not update the content.

You have to update the content alos in ajax success like

jQuery('.top-cart-content').html(data.mini_cart);

And in controller where ajax request is sent add below code

 if ($this->getLayout()->getBlock('cart_sidebar')) {
                            $sidebarCart = $this->getLayout()->getBlock('cart_sidebar')->toHtml();
                        }
                        if ($this->getLayout()->getBlock('cart_sidebar_mini')) {
                            $mini_cart = $this->getLayout()->getBlock('cart_sidebar_mini')->toHtml();
                        }

$ajaxData['sidebar_cart'] = $sidebarCart;
                        $ajaxData['mini_cart'] = $mini_cart;

$this->getResponse()->setBody(Mage::helper('core')->jsonEncode($ajaxData));
           return;