Magento – Magento Ajax cart remove items not working in mini cart

So I came up with a solution that works just awesome. I added another controller action and a model to do the Magento Interactions during my ajax calls. So let me show you how it's done, I hope somebody can profit from this sooner or later :)

My new Action:

public function updateAction ()
   {

      //Instantiate Product Model
      $productModel = Mage::getModel('doorconfig/product');

      //Get Updated Values from the Model
      $currentProduct = $productModel->getProduct($_POST);
      $currentProductId = $currentProduct->getId();
      $currentProductUrl = $currentProduct->getProductUrl();
      $currentPrice = $productModel->getPrice($currentProductId);
      $currentType = $this->getRequest()->getPost('doorconfig_type');
      $currentSize = $this->getRequest()->getPost('doorconfig_size');
      $currentProductBaseImgUrl = $productModel->getDoorBaseImgUrl($currentType,$currentSize);

      //Populate Resultarray
      $result = array("currentProductId"=>$currentProductId,"currentPrice"=>$currentPrice,"currentProductUrl"=>$currentProductUrl,"currentProductBaseImgUrl"=>$currentProductBaseImgUrl);

      //Encode Result in JSON
      $this->getResponse()->setBody(Mage::helper('core')->jsonEncode($result));

      return $result;
   }

My model just got most of the business logic from my block, so nothing special to point out about that.

And finally the updated Ajax section which now triggers my new controller action, receives the result as a JSON encode and changes the values in the DOM:

<script type="text/javascript">

   var $price = "";
   var $baseImgUrl = "";
   var $productUrl = "";
   var $productId = "";
   var $f = $j("#attributeform");
    var $formData;
    var $currentStoreUrl = "<?php echo $currentStoreUrl ?>";

   function ajaxUpdate()
   {

      $j.ajax({
         url: "/doorconfig/index/update",
         type: "POST",
         data: $formData,
         dataType: "json",
         success: function(data) 
                {
                  $productId = data.currentProductId;
                  $price = data.currentPrice;
                  $baseImgUrl = data.currentProductBaseImgUrl;
                  $productUrl = data.currentProductUrl;
                     $j("#result").text($price);

                     $j("#addtocart").attr('href',  $currentStoreUrl + "checkout/cart/add?product=" + $productId + "&qty=1");
                     $j("#productimg").attr('src', $baseImgUrl);

                     console.log(data);

                   },
            error: function(error)
                  {
                     console.log("Error:");
                     console.log(error);
                     alert("ERROR");
                  }
        });
    };

   $j(document).ready(function() 
   {

      $j("#result").text('<?php echo $defaultProductPrice; ?>');
      $j("#addtocart").attr('href', '<?php  echo $currentStoreUrl . "checkout/cart/add?product=" . $defaultProductId . "&qty=1" ?>');
      $j("#moreinfo").attr('href', '<?php echo $defaultProductUrl; ?>');
      $j("#productimg").attr('src', '<?php echo $defaultProductImgUrl; ?>');
      $j("#attributeform")[0].reset();

      $j("form[name=attributeform]").change(function () 
      {

         $formData = $f.serialize();
         ajaxUpdate();
      })
   });   

</script>

If you need any further explanation or wanna improve something please comment :)

Use this code

Create a delete action in your ajax add to cart controller.

Your Controller Action

    public function deleteAction()
    {
        if((int) $this->getRequest()->getParam('isAjax') == 1){
            $id = (int) $this->getRequest()->getParam('id');
            if ($id) {
                try {
                    $this->_getCart()->removeItem($id)->save(); 
                    $message = $this->__('Item was removed from your shopping cart.');
                    $response['status'] = 'SUCCESS';
                    $response['message'] = $message;
                    $this->getResponse()->setBody(Mage::helper('core')->jsonEncode($response));
                    return;

                } catch (Exception $e) {
            $response['status'] = 'ERROR';
            $response['message'] = $this->__('Cannot remove the item from shopping cart.');
            Mage::logException($e);
                }
            }
        } else {
            return parent::deleteAction();
        }
    }

Add the JS and button code in the app/design/frontend/[YOUR THEME]/[YOUR THEME]/checkout/cart/item/default.phtml

Js Function

    <script type="text/javascript">
        var deleting = 0;
        productRemoveFromCart = function(url, elem){
            deleting = deleting + 1;
            jQuery(elem).parent().parent().animate({ opacity: 0.5 }, 200, function() { });
            if (!url) {
                    //alert('Problem');
            }
            url = url.replace("checkout/cart","ajax/index");
            if(window.location.protocol == "https:") {
                url = url.replace("http:","https:");
            }
            url += '&isAjax=1';
            var data = 'isAjax=1';
            try {
                    jQuery.ajax( {
                            url : url,
                            dataType : 'json',
                            type : 'post',
                            data : data,
                            success : function(data) {
                                    deleting = deleting - 1;
                                    if(deleting<1){
                                        var pagepath = window.location.pathname;
                                        if((pagepath.indexOf("onestepcheckout")>0)||(pagepath.indexOf("checkout/cart")>0)){
                                            location.reload();
                                        }
                                    }
                            },
                            error: function (data) {
                                deleting = deleting - 1;
                            }
                            }); 
            } catch (e) {
            }
        }     
</script>

Button code

     <td class="a-center"><a href="javascript:void(0)" onclick="productRemoveFromCart('<?php echo $this->getDeleteUrl(); ?>',this);" title="<?php echo $this->__('Remove item')?>" class="btn-remove btn-remove2"><?php echo $this->__('Remove item')?></a></td>