mohsinali1317
mohsinali1317

Reputation: 4435

Hide Render page in some views Razor

In my mvc app I a have made one footer and embedded it like this

<div class="off-canvas-wrap" data-offcanvas>
    <div class="inner-wrap">
         @Html.Action("Menu", "Site")
        <aside class="main-section">
            @RenderBody()
        </aside>
        @RenderPage("~/Views/Shared/DisplayTemplates/_footer.cshtml")
    </div>
</div>

This code lies in my _layout.cshtml file, what I am trying to do here is to hide the footer on a certain page. Is it even possible to hide the footer on a particular page?

Looking forward for suggestions.

Upvotes: 4

Views: 4743

Answers (5)

Mayer Spitz
Mayer Spitz

Reputation: 2535

Add css to that page.cshtml that you want to hide the footer at.

footer {
    visibility: collapse;
}

Upvotes: 2

DrNice
DrNice

Reputation: 51

If you want to hide a footer for example from your layout, you can do like this:

In _layout:


    @if (IsSectionDefined("hidefooter"))
    {
         @RenderSection("hidefooter", false)
    }
    else  // Just regular footer from layout
    {
        <footer class="footer top30">
            <div class="container">
               <div class="row">
                  <div class="col-lg-12 text-center">
                        <p>Copyright &copy; ABC</p>
                   </div>
                </div>
                </div>
            </footer>
        }

In chtml file:
@section hidefooter {}

Upvotes: 4

Roy Dictus
Roy Dictus

Reputation: 33149

Yes, you can do that several ways, the first one using C# in Razor:

@if (myCondition)
{
    @RenderPage(...);
}

or you can have JavaScript with jQuery do it:

<script>
$(function() {
    if (myConditionInJavaScript) {
        $("#myfooter").hide();
    }
});
</script>

The JavaScript code above will be executed automatically once the entire page is loaded, thanks to the $(function() { ... }) jQuery functionality.

Upvotes: 3

Nikitesh
Nikitesh

Reputation: 1305

Since your condition will be in the page being rendered and not the layout you will either have to keep some global function which can be called after the page is loaded. Something like

window.myfunction =function() {
    if (myConditionInJavaScript) {
        $("#myfooter").hide();
    }
}

and call this function in your child page. by window.myfunction();

Also you can use Viewbag but you need to set the value of the ViewBag in each view when it is being rendered or updated.

Most efficent way according to me would be maintaining two separate layouts if you have just one section that has to be hidden. Because whichever way you choose at every page load the condition will be fired which may result in a degraded performance.

Upvotes: 1

DeepakJ
DeepakJ

Reputation: 388

You have multiple options

  1. User jquery code to hide the footer div on that particular page. use $('#footerId').hide(); on that particular page.

  2. Use can set a viewbag on particular actionresult and check on the layout page that viewbag is set than hide otherwise keep as it is.

ex.

 @if(Viewbag.ShowFooter!="False")    
 {    
  @RenderPage("~/Views/Shared/DisplayTemplates/_footer.cshtml")    
 }

Upvotes: 3

Related Questions