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)
- {
-
- 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.
-
- Master.MasterLabel.Text = "From WebForm";
-
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 following 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>