Question

我想在MVC5中使用ajax单独重新加载局部视图。这是布局页面中的代码

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

从购物车控制器查看购物车返回

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

我有一个将项目添加到购物车的功能。在行动中，我将更新的项目返回到部分视图。但它没有呈现更新的视图。特定的div没有重新加载。

        <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");
   }

如何在不重新加载整个页面的情况下重新加载特定视图

Answer 1

使用jquery加载函数完成

        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

您将ID设置为Div

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

Ajax成功添加以下代码：

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

MVC如何刷新布局页面

2 个答案: