MasterPage
- The extension of MasterPage is '.master'.
- MasterPage
cannot be directly accessed from the client because it just acts as a template
for the other Content Pages.
- In
a MasterPage we can have content either inside ContentPlaceHolder or
outside it. Only content inside the ContentPlaceHolder can be customized in the Content Page.
- We
can have multiple masters in one web application.
- A
MasterPage can have another MasterPage as Master to it.
- The
content page content can be placed only inside the content tag.
- Controls
of MasterPage can be programmed in the MasterPage and content page but a content
page control will never be programmed in MasterPage.
- A
master page of one web application cannot be used in another web application.
- The
MasterPageFile property of a webform can be set dynamically and it should be
done either in or before the Page_PreInit event of the WebForm.
Page.MasterPageFile = "MasterPage.master". The dynamically set Master Page
must have the ContentPlaceHolder whose content has been customized in the
WebForm.
- The
order in which events are raised: Load (Page) a Load (Master) a LoadComplete (Page)
i.e. if we want to overwrite something already done in Load event handler of
Master then it should be coded in the LoadComplete event of the page.
- Page_Load
is the name of method for event handler for Load event of Master. (it's not
Master_Load).
Example:
Adding
a MasterPage to the Project
- Add a new
MasterPage file (MainMaster.master) to the Web Application.
- Change the Id
of ContentPlaceHolder in <Head> to "cphHead" and the Id "ContentPlaceHolder1" to
"cphFirst"
- Add one more
ContentPlaceHolder (cphSecond) to Master page.
- To the master
page add some header, footer and some default content for both the content place
holders.
<form id="form1" runat="server">
Header...<br />
<asp:ContentPlaceHolder id="cphFirst" runat="server">
This is First Content Place Holder (Default)
</asp: ContentPlaceHolder>
<br />
<asp:ContentPlaceHolder ID="cphSecond" runat="server">
This is Second Content Place Holder (Default)
</asp:ContentPlaceHolder>
<br /> Footer...
</form>
- To the web application add a WebForm (Default.aspx) a Check (Select Master Page) in New Item Dialog
- Note the attribute
"MasterPageFile" in @Page directive of the WebForm.
- Delete the <content tag for the
ContentPlaceHolderId="cphSecond".
- Run the WebForm - The output
rendered includes the Header, Footer, Contentof cphSecond in Master and the
content of <content tag for ContentPlaceHolderId="cphFirst" in webform.
- Here we understood the importance
of ContentPlaceHolder in Master and Content in WebForm.
- Add a Label in the master page
(outside ContentPlaceHolder)
<asp:Label ID="lblMaster" runat="server" Text="In Master"/>
- Add a Button to WebForm (inside content tag)
<asp:Button ID="btnDemo" runat="server" onclick="btnDemo_Click" Text="Set Label of Master" />
- Handle the Click event of above button and add to it the code as mentioned below.
protected void btnDemo_Click(object sender, EventArgs e)
{
//Get reference to Label control (lblMaster) in the master page.
Label lbl = (Label)Master.FindControl("lblMaster");
lbl.Text = "From WebForm Page...";
}
- Run the WebForm and Click on Button to see that the text in master page Label has changed.
- To the class in MainMaster.master.cs add the following property.
public Label MasterLabel
{
get { return lblMaster; }
}
- To the Default.aspx add the following
<%@ MasterType VirtualPath="~/MainMaster.master" %>
- Replace the existing code in btnDemo_Click with the following.
//To set Text of Label in master page using the public property MasterLabelMaster.MasterLabel.Text = "From WebForm";
//The above line would work only if <%@MasterType Directive is added to current page
Importance of UniqueID and ClientId
- Add a TextBox and HTML Button to webform /
content page which has master page.
<asp:TextBox runat="server" ID="txtWebForm"/>
<input type="button" value="ClientButton" onclick="ShowAlert()" />
- Add the follwing to the webform (cphHead is Id of ContentPlaceHolder added to Head section of Master Page)
<asp:Content ID="cntHead" ContentPlaceHolderID="cphHead" runat="server">
<script language="javascript" type="text/javascript">
function ShowAlert()
{
txt = document.<%=Page.Form.Name%>.<%=txtWebForm.UniqueID%>
alert(txt.value);
}
</script>
</asp:Content>