MVC Razor - Using Sections & Partial Views

CodeProject
Being a web developer, dealing with page layouts and striving for optimized code will be our D2D activity.
In typical Asp.Net scenario we use Master Pages and User controls for these two tasks respectively.
So, today we will see how we handle these things in MVC Razor 3.0.
There are no Master Pages and User controls in MVC.
You know why? Comparatively they are complex to develop. :)

In order to implement both Sections and Partial Views, i will take a task of displaying a small Menu which will redirect me to 2 different pages in my application.

There are 3 ways of doing it.
1. Hard coding the menu on Master Page.
2. Rendering the menu based on Page.
3. Using Partial Views.


In MVC, ~/Views/Shared/_Layout.cshtml plays the role of Master page.

#1 is straight forward and simple. But, what if i don't need to display the menu on all the pages.

#2 If we have a application where only a few pages will show the menu.
This i will handle by declaring a section on _Layout.cshtml page.

<section id="Sidebar" class="sidebarcotent">
    @* Default SideBar Content*@
    @RenderSection("SideBar", required: false)
</section>

Look at "Required : false" part of the @RenderSection method, this means the rendering is optional.
If i haven't defined any content for "Sidebar" section, the page will not display any menu on its sidebar.

I want to display menu on ~/views/Home/Index.cshtml page. So, i will define "Sidebar" section.

@section Sidebar{
<b>Using Sections</b><br />
<b>Sidebar content:</b>
<ul style="display:list-item">
    <b> <li>@Html.ActionLink("Sections", "Index", "Home")</li></b>
     <li>@Html.ActionLink("Partial Views", "About", "Home")</li>
</ul>
}

Lets see the Output now.

But here we have a point to consider.
Lets say i have to display this menu on 60 out of 100 pages. So, in this scenario i have to define the "Sidebar" section content in all 60 pages. This will increase cost of development and even cost of maintenance.

#3. In this kind of scenarios in regular Asp.Net, we use User controls. Here we use Partial Views.
How to define a Partial View?
When you create a View, there is a checkbox prompting "Create as a Partial View".

 When you check it, it will disable the Master page options, thus create a partial view.
Both regular Views and Partial views are .cshtml files. Partial views can tap into the models contained in your application as well as share data between other application components.
I defined the same content of Menu in partial view.

<b>Using Partial View</b><br />
<b>Sidebar content:</b>
<ul style="display:list-item">
     <li>@Html.ActionLink("Sections", "Index", "Home")</li>
    <li>@Html.ActionLink("Partial Views", "About", "Home")</li>
</ul>

We are done with defining the partial view, now we need to render this partial view instead of content.
Partial Views can be rendered by two methods.
1. @Html.Partial("MenuPartialControl")
2. @Html.RenderPartial("MenuPartialControl")

RenderPartial() will be used when you have media centric(Images & Videos) partial views. When you use RenderPartial, the view will be rendered directly using "Html Response Stream" thus making processing fast.

Partial() Will be used when you wanna send ViewBag object between Views/Partial Views.
Lets see the out put when is used both Section and Partial veiws on the same page.

Just like User controls, the functionality will be centralized with Partial Views. The best part is, partial views use the @Model used by the page hosting it. If its a strongly typed View, you will get intellisence for @Model.
Code:
Click Here
Is it helpful for you? Kindly let me know your comments / Questions.