Question

我正在创建一个MVC应用程序，其中左侧菜单将在用户登录到应用程序时首次加载，并且单击任何菜单选项时，将显示右侧内容（将调用操作方法）。

我使用部分视图实现了它。在部分视图上创建整个应用程序是否有用，还是有其他方法可以实现这一点？

Answer 1

看起来您想要以异步方式加载单击链接的页面。你可以使用jQuery ajax方法做到这一点。

首先，使用css类名称标记链接，以便我们可以将其用作jQuery选择器来连接ajaxfied加载行为。您还应该有一个内容页面，我们将加载ajax调用的结果。

<div>
  <div id="leftPane">
     <a href="@Url.Action("About","Home")" class="alink">About</a>
     <a href="@Url.Action("Contact","Home")" class="alink">Contact</a>
     <a href="@Url.Action("Index","Home")" class="alink">Index</a>
  <div>
  <div id="rightPane">
  </div>
</div>

现在你可以听到那些链接上的click事件，使用jQuery load方法获取那些action方法的内容并更新rightPane的innerHtml

$(function(){

   $("a.alink").click(function(e){
     e.preventDefault();
     $("#rightPane").load($(this).attr("href"));
   });

});

使用正确的css，您可以将leftPane保留在容器的左侧，将rightPane保持在右侧。

在菜单选项上修改菜单左侧和右侧内容更改单击MVC

1 个答案: