防止在MVC中重新加载布局页面中的菜单 [英] prevent menu in layout page in reloading in mvc

问题描述

我在布局页面上有一个菜单，例如

I have a menu in layout page like

<li class="treeview">
  <a href="#">
    <i class="fa fa-users"></i>
    <span>Customer</span>
  </a>
  <ul class="treeview-menu">
    <li><a href="/Customer/CustomerDetails"> <i class="fa fa-angle-double-right"></i>View Customer</a></li>
    <li><a href="/Customer/AddCustomer"> <i class="fa fa-angle-double-right"></i>Add Customer</a></li>                       
  </ul>
</li>

<div class="content">
  @RenderBody()
</div><!-- /.content -->

在addcustomer视图中，我正在使用

In addcustomer view I am using

$(document).ready(function () {        
  $("ul .treeview-menu a").click(function (e) {
    $('#content').load("/Customer/AddCustomer");
  });
}); 

我想加载视图而不重新加载整个页面.

I want to load view without reloading the whole page.

推荐答案

您应该使用(.content)而不是(#content)

实施@Stephen答案:

Implementing @Stephen answer:

布局页面:

<script>
$(document).ready(function () {  
    //Select (AddCustomer) link specifically      
      $("#AddCustomer").click(function (e) {
        $('.content').load("/Customer/AddCustomer");
         return false;
      });
    }); 
</script>

<li class="treeview">
  <a href="#">
    <i class="fa fa-users"></i>
    <span>Customer</span>
  </a>
  <ul class="treeview-menu">
    <li><a id="ViewCustomer" href="/Customer/CustomerDetails"> <i class="fa fa-angle-double-right"></i>View Customer</a></li>
    <li><a id="AddCustomer" href="/Customer/AddCustomer"> <i class="fa fa-angle-double-right"></i>Add Customer</a></li>                       
  </ul>
</li>

<div class="content">
  @RenderBody()
</div>

在addcustomer操作方法中:

In addcustomer action method:

public ActionResult AddCustomer()
{
    return View("addcustomer");
}

这篇关于防止在MVC中重新加载布局页面中的菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！