Question

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

<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视图中我正在使用

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

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

Answer 1

您应该使用（.content）代替（#content）

实施@Stephen答案：

布局页面：

<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行动方法中：

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

Answer 2

我有很多观点，所以我将布局页面中的脚本更改为

   $("ul .treeview-menu a").click(function (e) {

        var ulr = $(this).attr("href");
        alert(ulr);
        $('.content').load(ulr);
        return false;
    });

在mvc中重新加载时阻止布局页面中的菜单

2 个答案: