从子页面控制布局渲染

时间:2013-12-10 18:47:59

标签: asp.net asp.net-mvc twitter-bootstrap

我有一个布局页面,目前有一个使用该布局的页面。我希望页面的一部分可以在子页面中显示或隐藏。如果它被隐藏,则需要调整其他样式更改,例如主内容div的宽度。以下是我的非工作尝试:

布局页面

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
    ViewBag.ShowTree = true;
}

<div class="row">
    @if(ViewBag.ShowTree){
    <div class="col-md-2">
        @Html.Action("ItemTree")
    </div>
    }
    <div class="@(ViewBag.ShowTree ? "col-md-10" : "col-md-12")">
        @RenderBody()
    </div>
</div>

儿童页面

@{
    ViewBag.Title = "Edit";
    Layout = "~/Views/Shared/_NestedLayout.cshtml";
    ViewBag.ShowTree = false;
}

在此实例中,ShowTree的值设置为true,布局页面呈现,然后子项将其设置为false并且内容呈现。这基于MVC的页面生命周期而言非常有意义。但当然不是我希望它如何运作。

我知道我可以在控制器中设置这个值,而不是在布局/网页中设置它,但我想让它纯粹是一个设计的东西,如果我能把它从控制器中取出来

我的偏好是它根本不会调用操作,而不仅仅是用JavaScript隐藏数据。

1 个答案:

答案 0 :(得分:0)

我喜欢你的方法,但是如果这不起作用,那么我能想到的唯一其他机制可以看出子视图可以控制布局的方法就是使用@section。不理想,但应该有效。

布局页面:

<div class="row">
    @RenderSection("ItemTreeSection", required: false)

    <div class="@(ViewBag.ShowTree ? "col-md-10" : "col-md-12")">
        @RenderBody()
    </div>
</div>

儿童观点:

@section ItemTreeSection {
    <div class="col-md-2">
        @Html.Action("ItemTree")
    </div>
}