Question

我对MVC很新，因此可能是一个基本问题。

我创建了一个名为HomeController的控制器，它有一个显示导航面板的视图，其行为类似于菜单，但应始终作为Windows资源管理器中的文件夹显示。点击一个项目，我想在右侧加载另一个视图（类似于主细节）。每个项目都有一个视图和一个模型。要加载导航面板，我有以下代码

        @foreach (var service in Model.Services)
        {
            @Html.ActionLink(service.Label, "Details", new { serviceName = service.ServiceName })

        }

此代码工作正常，但代码打开另一个视图，我的导航列表消失。请指导如何打开我的详细信息视图以及主视图

Answer 1

您需要使用ajax来执行此操作。

将您的页面拆分为两部分。左 - 链接容器div和右预览div。当您单击链接时，使用ajax调用该链接并更新同一页面的DOM（预览div）。

<div>
  <div class="pageLeftMenuContainer">
      @foreach (var service in Model.Services)
      {          
        @Html.ActionLink(service.Label, "Details",
              new { serviceName = service.ServiceName },new { @class="ajaxLink"})
      }
  </div>
  <div class="pageRight" id="preview"></div>
</div>

现在使用css类ajax链接监听链接上的click事件并加载预览div。您可以使用jquery load（）方法。

$(function(){
   $(".ajaxLink").click(function(e){
     e.preventDefault(); // prevent the normal link click behavior
     $("#preview").load($(this).attr("href"));
   });
});

并排显示视图

1 个答案: