Sections in ASP.NET MVC Layout Page | ASP.NET MVC Programmer Guide | ASP.NET MVC Tutorial

In ASP.NET MVC, a layout page consists of sections. A section is an area that derived pages can override. You might want to use this feature to let each page specify CSS and script (and of course markup) that needs be specific. Each layout must contain at least the section for the body.

<div class="container">
    @RenderBody()
    <hr />
    <footer>
        © @DateTime.Now.Year - ASP.NET QuickUp
    </footer>
</div>

The markup above indicates that the entire body of the page replaces @RenderBody. You can define custom sections in a layout file using the following line:

@RenderSection("CustomScripts")

The name of the section is unique but arbitrary and you can have as many sections as you need with no significant impact on the rendering performance. You just place a @RenderSection call where you want the derived page to inject ad hoc content. The example above indicates a section where you expect the page to insert custom script blocks. However, there’s nothing that enforces a specific type of content in a section. A section may contain any valid HTML markup. If you want to force users to add, say, script blocks, you can proceed as follows:

<script type="text/javascript">
   @RenderSection("CustomScripts")
</script>

In this case, overridden sections are expected to contain data that fits in the surrounding markup; otherwise, a parsing error will be raised. In a derived page, you override a section like this:

@section CustomScripts
{
   alert("Hello");
}