Partial Views in Asp.Net MVC


Like Layouts Partial Views also reusable components in Asp.Net MVC, but only difference is Layouts used for reuse of the specific portion of the View to maintain consistent look and feel Partial Views are used for reuse the any portion of the View.

For example if you want to display the stock report of your company in only few pages and also in different places we can use Partial Views. In this scenario place stock report details in one View and render that view in other views where it requires.

Partial Views also like normal view only, but it has renders in some other view. Let’s discuss Partial Views with simple example.

Open Microsoft Visual Studio 2013 => Create simple Asp.Net MVC application with the project name as PartialViewsExample.

Right click on Views folder and select Add => View, name it as PartialView1. Add below code in the PartialView1.

@{

    Layout = null;

}

 

<!DOCTYPE html>

 

<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>PartialView1</title>

</head>

<body>

    <div>

        This is Example of Partial View.

    </div>

</body>

</html>

 

Now render this partial view in any other view by using HTML helper method Html.Partial() method as shown below.

@{

    Layout = null;

}

 

<!DOCTYPE html>

 

<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>Index</title>

</head>

<body>

    <div>

        @Html.Partial("PartialView1")

    </div>

</body>

</html>

 

In this we can use Partial views to render reusable content anywhere in the page. We will discuss more in detail in coming articles.