Master Page solution just like in ASP.NET 2!

Sample Image - MasterPage.jpg

Introduction

In this article, we can see a simple solution for the master page coding . In future, update to framework 2 will be simple, since the solution is very similar to the new framework design.

Using the code

All we need to do for the master-page to work is:

Derive our page from the master page.
Enclose all the page in a tag named "content".
Leave the form name "Form1", as it come by default.
Use a user control as the master, and include in its HTML code asp:placeholder named "ContentPlaceHolder".

How does it work?

The master user control, has a tree of controls, one of them is the placeholder named "ContentPlaceHolder". On the other hand, the page itself has a tree of controls, one of them is the "content" (actually it has a tree under the list: Form1->content).

The process is:

Take the content, and move it under the placeholder in the master user control.
Take the hole master user control and move it to under the Form.

That is all.

The code

The Master Page code:

public class MasterPage : System.Web.UI.Page
    {
        public MasterPage() : base()
        {
            this.Init +=new EventHandler(MasterPage_PreInit);
        }
 
        private void MasterPage_PreInit(object sender, EventArgs e)
        {
            //LOAD TEMPLATE
            //Replace path with aplication parameter!

            UserControl template = 
                (UserControl)LoadControl("~/MasterTemplate.ascx");

            //LOAD CONTENT

            Control content = this.FindControl("content");


            //ADD CONTENT TO TEMPLATE

            template.FindControl("ContentPlaceHolder").Controls.Add(content);

 
           //ADD TEMPLATE TO PAGE

            this.FindControl("Form1").Controls.Add(template);    
        }
    }

Here is a Master User Control. The only thing we must do is to include the placeholder named ContentPlaceHolder.

<%@Control Codebehind="MasterTemplate.ascx.cs" 
           Inherits= "MasterPage.MasterTemplate" ... %>
<TABLE id="Table1"  runat="server">
   <tr>
      <TD height="22" align="center">This Is The Header</TD>
  </tr>

  <TR>
   <TD vAlign="top" align="right"> 
     <tableid="table2" runat="server">
      <tr> 
        <td>
           <asp:placeholder id="ContentPlaceHolder" 
                   runat="server"></asp:placeholder>
        </td>       
      </tr> 
      <tr height= "10>
        <td><asp:labelid="LabelError" 
               Runat= "server">Fatal error...</asp:label>
         </td>
       </tr>
     </table>
    </TD>
  </TR>

  <tr height="10"> 
     <td align="center">This Is The Bottom</td>  
   </tr>
</TABLE>

And here is the page. All the code rendered in the BODY must be enclosed in a tag named content.

<%@ Page ...  %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
    <body>
        <form id="Form1" method="post" runat="server">
            <asp:panel id="content" runat="server" HorizontalAlign="Center">
                <asp:Calendar id="Calendar1" runat="server" ... ></asp:Calendar>
            </asp:panel>
        </form>
    </body>
</HTML>

And here is the page code behind. The only thing we must do is to derive it from the base page, MasterPage.

public class WebForm1 : MasterPage
{
      ...
}

Move to ASP.NET 2

To change our code to run under the new framework we will need to:

remove the call to the method MasterPage_PreInit.

call

Page.MasterPagePage.MasterPageFile = "~/MasterPage.master";

Or add in the page directive:

<%@ Page MasterPageFile="~/MasterPage.master" ... %>

The new view of Master Page in ASP.NET 2:

History

The code in this article is based on a presentation of Alik Levin from Microsoft.

Visit Yitzhak Gootvilig's blog.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here