Year End Sale: Get Upto 40% OFF on Live Training! Offer Ending in
D
H
M
S
Get Now
Different Ways of Rendering Layouts in Asp.Net MVC

Different Ways of Rendering Layouts in Asp.Net MVC

28 Mar 2024
Intermediate
255K Views
4 min read
Learn with an interactive course and practical hands-on labs

ASP.NET MVC with Web API Foundations Course - Free

Layouts in Asp.Net MVC: An Overview

In Asp.Net MVC, Layouts are like Master Pages in Asp.Net WebForms. These help us maintain a consistent look and feel across all the views within your Asp.Net MVC application. Like Master Pages, layouts may contain common CSS, and jQuery files across the multiple Views and one or more placeholders for which Views provide content. Before it, you can go through types of Layouts like Layouts, RenderBody, RenderSection, and RenderPage in ASP.NET MVC.

In Asp.Net MVC, at the application level, we have a _ViewStart file within the Views folder for defining the default Layout page for your Asp.Net MVC application. In this article, I am going to expose the different ways to apply layout pages for your application. Suppose we have to render the layouts as shown in the fig. by using various ways.

Read More: MVC Interview Questions and Answers

Methods To Render Layouts in Asp.Net MVC

1. Control Layouts Rendering by using the _ViewStart file in the root directory of the Views folder

We can change the default rendering of layouts within the _ViewStart file by using the below code:

@{
 var controller = HttpContext.Current.Request.RequestContext.RouteData.Values["Controller"].ToString();

 string layout = "";
 if (controller == "Admin")
 {
 layout = "~/Views/Shared/_AdminLayout.cshtml";
 }
 else
 {
 layout = "~/Views/Shared/_Layout.cshtml";
 }
 
 Layout = layout;
}

2. Return Layout from ActionResult

We can also override the default layout rendering by returning the layout from the ActionResult by using the below code:

public ActionResult Index()
{
 RegisterModel model = new RegisterModel();
 //TO DO:
 return View("Index", "_AdminLayout", model);
}

3. Define the Layout Within Each View on the Top

We can also override the default layout rendering by defining the layout on the view by using the below code:

@{
 Layout = "~/Views/Shared/_AdminLayout.cshtml";
}

4. Adding _ViewStart file in each of the Directories

We can also set the default layout for a particular directory by putting the _ViewStart file in each of the directories with the required Layout information as shown below:

@{
 Layout = "~/Views/Shared/_AdminLayout.cshtml";
}

Rendering Methods

ASP.NET MVC layout view renders child views using the following methods.
MethodDescription
RenderBody()Renders the portion of the child view that is not within a named section. The layout view must include the RenderBody() method.
RenderSection(string name)Renders the content of the named section and specifies whether the section is required.
Rendering Methods
In the above figure, the _Layout.cshtml includes the RenderBody() method and RenderSection() method. Above, Index.cshtml contains the named sections using @section where the name of each section matches the name specified in the RenderSection() method of a layout view _Layout.cshtml, e.g. @Section RightSection.
At run time, the named sections of Index.cshtml, such as LeftSection, RightSection, and MiddleSection will be rendered at the appropriate place where the RenderSection() method is called. The rest of the Index.cshtml view, which is not in any of the named sections, will be rendered in the RenderBody() is called.
Summary

I hope you will enjoy the tips while rendering layouts in your MVC application. I would like to have feedback from my blog readers. Your valuable feedback, questions, or comments about this article are always welcome.

FAQs

The views are ASP.NET Web pages that are rendered by the MVC framework.

 It introduced a Layout view that contains these common UI portions so that we don't have to write the same code on every page

MVC allows the use of multiple layouts in a single application.
Share Article
About Author
Shailendra Chauhan (Microsoft MVP, Founder & CEO at ScholarHat)

Shailendra Chauhan, Founder and CEO of ScholarHat by DotNetTricks, is a renowned expert in System Design, Software Architecture, Azure Cloud, .NET, Angular, React, Node.js, Microservices, DevOps, and Cross-Platform Mobile App Development. His skill set extends into emerging fields like Data Science, Python, Azure AI/ML, and Generative AI, making him a well-rounded expert who bridges traditional development frameworks with cutting-edge advancements. Recognized as a Microsoft Most Valuable Professional (MVP) for an impressive 9 consecutive years (2016–2024), he has consistently demonstrated excellence in delivering impactful solutions and inspiring learners.

Shailendra’s unique, hands-on training programs and bestselling books have empowered thousands of professionals to excel in their careers and crack tough interviews. A visionary leader, he continues to revolutionize technology education with his innovative approach.
Accept cookies & close this