ASP.. NET MVC如何在布局中使用PartialView

本文关键字:PartialView 布局 NET MVC ASP | 更新日期: 2023-09-27 18:02:50

我需要通过使用部分视图在布局中渲染菜单(如果有更好的方法,请让我知道)。我是这样做的(在Layout中):

 @if (User.IsInRole("Admin"))
   {
      @Html.Partial("AdminMenu")
   }

这就是我在Controller中的调用方式:

public ActionResult AdminMenu()
  {
      var am = _amr.GetAdminMenu();
      return PartialView(am);
  }

这是我的局部视图:

@model IEnumerable<DigitalHubOnlineStore.ViewModels.AdminMenuViewModel>
<div class="dropdown">
    <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
        Admin menu
        <span class="caret"></span>
    </button>
    <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
        @foreach (var item in Model)
        {
            <li><a href="@Html.DisplayFor(modelItem => item.MenuItemUrl)">@Html.DisplayFor(modelItem => item.MenuItemName)</a></li>
        }
    </ul>
</div>

ASP.. NET MVC如何在布局中使用PartialView

你需要使用

@{Html.RenderPartial("Admin");}

Html。Partial只将视图作为字符串返回,它不将其写入响应,所以只是调用它什么也不做,返回的字符串超出了范围。它存在的原因是你可以渲染一个部分视图到一个字符串,然后在多个地方插入字符串,而不需要渲染部分视图多次。例如,如果您希望在页面的顶部和底部使用相同的分页标记。或者你想复制一个制表符部分视图来创建多个制表符,等等等等。

要使当前代码工作,请尝试

Model ......
@{
   Layout=.....
   var adminMenu = Html.Partial("Admin");
}
@if (User.IsInRole("Admin"))
{
   Html.Raw(adminMenu);
}

Html。RenderPartial做同样的事情,但在内部调用Write将其写入响应。

现在如果你的局部正在接受一个模型那么你需要给它一个控制器方法,

[ChildActionOnly]
public ActionResult AdminMenu(AdminMenuViewModel model)
{
    return Partial(model);
}

然后将调用代码更新为

 @{Html.RenderAction("AdminMenu", "ControllerHere", new { model = TheAdminViewModelHere });}

就我个人而言,我更喜欢使用childlyaction的部分视图,因为我可以将所有的处理逻辑移动到部分视图的控制器中,这样性能更好。它还允许分部视图了解它的父上下文,因为它允许你访问控制器,向模型添加信息以传递给分部视图。

你要么在父视图中返回菜单集合,将相关的模型发送给Partial,要么从你的Partial中调用另一个HtmlForm, AjaxForm或ajax。

@Html.Partial("Partials/AdminMenu",Model.AdminMenuItems)

//SERVER
  public ActionResult AdminMenu()
  {
      var am = _amr.GetAdminMenu();
      return Json(am,JsonBehaviour.AllowGet);
  }

  //CLIENT
    @using (Ajax.BeginForm("AdminMenu","AdminController", null,  
        new AjaxOptions
        {
            OnSuccess = "renderSuccess",
            OnFailure = "renderFailure",
            OnBegin = "renderBegin"
        },
        new
        {
            id = "frmViewerAdminMenu",
            name = "frmViewerAdminMenu"
        })
    )
    {
    ...
        <script type="text/javascript">
            function renderSuccess(ajaxContext){
               /// ajaxContext is whatever comes back from GetAdminMenu()
            }
        </script>
     ...
    }

—Server Render View

public ActionResult AdminMenuRenderView()
{
    return Partial("AdminMenuPartial",GetAdminMenuItems());
}

——部分AdminMenuViewDynamicLoader

 @using (Ajax.BeginForm("AdminMenuRenderView","AdminController", null,  
    new AjaxOptions
    {
        OnSuccess = "renderSuccess",
        OnFailure = "renderFailure",
        OnBegin = "renderBegin"
    },
    new
    {
        id = "frmViewerAdminMenu",
        name = "frmViewerAdminMenu"
    })
)
{
...
    <div id="divAdminMenuContent"></div>
    <script type="text/javascript">
        function renderSuccess(ajaxContext){
            $('#divAdminMenuContent').html(ajaxContent);
        } 
    </script>
 ...
}

—Partial AdminMenuPartial

@model IEnumerable<DigitalHubOnlineStore.ViewModels.AdminMenuViewModel>
<div class="dropdown">
    <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
        Admin menu
        <span class="caret"></span>
    </button>
    <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
        @foreach (var item in Model)
        {
            <li><a href="@Html.DisplayFor(modelItem => item.MenuItemUrl)">@Html.DisplayFor(modelItem => item.MenuItemName)</a></li>
        }
    </ul>
</div>