MVC how to refresh partial view which is in layout page

Question

I want to reload partial view alone using ajax in MVC5. Here is my code in layout page

 <div class="col-md-2 col-sm-5 col-xs-12 shopping_cart pull-right">                         
      @{ Html.RenderAction("ViewCart", "Cart"); }
  </div>

From cart controller view cart returns

 public ActionResult ViewCart()
 {
   //code
    return PartialView("ViewCart", CartList);
 }

I have a function to add items into cart. In action i'm returning updated items to partial view. But it is not rendering the updated view. The particular div is not reloading.

        <script type="text/javascript">

            $(".addToCart").click(function (event) {
                //prevent default action from the link provided in html
                event.preventDefault();

                $.ajax({
                    url:$(this).attr("onclick"),
                    success:function(){
                        alert("Product added to cart");
                    }
                });//ajax end

            });//end click
        </script>



   public ActionResult(decimal pid, decimal cnt)
   {
     //code to add items into table
     return RedirectToAction("ViewCart");
   }

How to reload the particular view without reloading the entire page

Answer 1

Done using jquery load function

        function loadPartialView() {
            //load cartitems to div
            $('#cart').load('/Cart/ViewCart/');          
        };

        $(function () {
            loadPartialView(); // first time
            // re-call the function each 5 seconds
            window.setInterval("loadPartialView()", 5000);
        });

    </script>

Answer 2

You Set id To Div

 <div id="cartdetails" class="col-md-2 col-sm-5 col-xs-12 shopping_cart pull-right">                         
  @{ Html.RenderAction("ViewCart", "Cart"); }  
</div>

Ajax sucess in Add following Code:

$("#cartdetails").load("/Cart/ViewCart");