Home > DeveloperSection > Blogs > Working with Partial View in MVC Razor

Working with Partial View in MVC Razor


ASP.NET MVC Mvc3  Razor 
Ratings:
0 Comment(s)
 3149  View(s)
Rate this:

Working with Partial View in MVC Razor

Hi everyone in this blog, I’m explaining about partial view in mvc.

Description:

In general a Partial View is like a web user control in ASP.Net applications. Partial Views and User Controls serve the same purpose.

ASP.NET MVC consists of three main parts - Model, View and Controller. Model represents the business entity or domain object and it manages the state of View. Controller controls the application logic and communication between Model and View. A view represents the user interface, which receives input from user and sends to controller for further action. In this blog, I explain about ASP.NET MVC special views like Partial Views and Layouts.

Uses of Partial Views

  1. A partial view can be used as a reusable component that can be called or used from multiple and different views.
  2. A partial view contains reusable mark-up if you want to render from inside multiple views.
  3. The partial view are used to render a consistent look like header, footer, comments and so on.

Rendering Partial View: We can render a partial view using one of the following 4:

  1. Html.Partial
  2. Html.RenderPartial
  3. Html.Action
  4. Html.RenderAction

 

Now in my example I will add a partial view. For this go to Solution Explorer then select Views -> Shared Folder -> Right-click -> Add View.

 

Give a name to your View and check Create As a partial View as in the following:

 

Now I am writing a line of text in this Partial View:

 

Now for the Home controller, here I add a new action ShowMyPartialView(). So after it my Home Controller will look such as below:

 

Now for the View -> Home -> Index.cshtml.

Here I am rendering a Partial View using 4 types, so the index.cshtml will be like the following:

 

@{

    ViewBag.Title = "Index";

}

 

<h2>Index</h2>

 

<h3>Rendering Partial View:</h3>

<ol class="round">

    <li class="one">

        <h5>By Using Html.RenderPartial #</h5>

        @{Html.RenderPartial("MyPartialView"); }

    </li>

 

    <li class="two">

        <h5>By Using Html.Partial #</h5>

        @Html.Partial("MyPartialView")

    </li>

 

    <li class="three">

        <h5>By Using Html.RenderAction #</h5>

        @{Html.RenderAction("ShowMyPartialView", "Home");}

    </li>

    <li class="four">

        <h5>By Using Html.Action #</h5>

        @Html.Action("ShowMyPartialView")

    </li>

</ol>

 

 

Output:

in my next post i'll explain about Online and Offline Events in HTML5


Don't want to miss updates? Please click the below button!

Follow MindStick