Post
Ask Question

Content Page and Master Page in ASP.NET MVC


Use of  Master Page in ASP.NET MVC Application

As we know, to develop any application which is a combination of various pages having different functions but some part  remains the same on all the pages of maximum pages hence to overcome the workload of doing same work again and again for all the pages we can use the facility of view master page in MVC .As  in an application their are total ten views and five of them are having same structure and other five are having different structure hence in that case we can use two different master pages and can overcome the workload.

Let's starts with creating the View Master Page in an application in which the user requires the same structure to be used on all pages.

Steps to add Master Page to MVC project :

Right-click the Shared (View) folder

1n.gif

Then select on Add>New Item

After that select the MVC View Master Page template

2.gif

Now if user requirements are different for some pages then he/she can create another master pages as per requirement and can overcome the workload.

Now Code of the Master Page

<%@  Master Language="C#" AutoEventWireup="true" CodeBehind="Site.Master.cs" Inherits="MvcApplication10.Views.Shared.Main" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head2" runat="server">
    <title></title>
    <style type="text/css">
        html
        {
            background-color: gray;
        }
        .column
        {
            float: left;
            width: 300px;
            border: solid 1px black;
            margin-right: 10px;
            padding: 5px;
            background-color: white;
            min-height: 500px;
        }
    </style>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <h1>
        My Website</h1>
     <div
class="column">
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        </asp:ContentPlaceHolder>
    </div>
    <div class="column">
        <asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
        </asp:ContentPlaceHolder>
    </div>
</body>
</html> 


3.gif

Now implementation of View Master Page in Content View Page

Step to Create a View Content Page based on master page

  •  Right click on Home (Views) folder
New Picture.bmp
  •  After that Select New Item and select MVC View Content Page
  •  Now enter the name and Click on Add button

4.gif

Code of the View Content Page

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" AutoEventWireup="true"    CodeBehind="Index.aspx.cs" Inherits="MvcApplication10.Views.Home.Index" %><asp:content id="Content1" contentplaceholderid="head" runat="server">
</asp:content>
<asp:content id="Content2" contentplaceholderid="ContentPlaceHolder1" runat="server">
</asp:content>
<asp:content id="Content3" contentplaceholderid="ContentPlaceHolder2" runat="server">
</asp:content>

Conclusion: Using master page we can work efficiently, easily and this feature makes working more user friendly while developing an application. 


Similar Articles