Welcome!

Microsoft Cloud Authors: Pat Romanski, Srinivasan Sundara Rajan, Glenn Rossman, Janakiram MSV, Steven Mandel

Related Topics: Microsoft Cloud

Microsoft Cloud: Article

Master Pages in ASP.NET 2.0

Simplify reuse and maintenance

Since the advent of Web development, Web developers have sought a way to provide a consistent look and feel across the Web application. This pursuit has resulted in different custom solutions. With the introduction of master pages in ASP.NET 2.0, Microsoft has finally brought the support to the framework level and has given the developers what they have been asking for. Master pages, as the name suggests, allow the developer to define the layout in a single page and easily apply the layout to multiple pages across the Web site, thereby ensuring a consistent appearance. This article looks at how we use master pages with the help of some examples. We will also look at some of the new features that are available in ASP.NET 2.0.

Master Pages
Master pages allow the developer to take a compartmentalized approach while developing Web sites. It allows the developer to move standardized layouts like header, footer, navigation, or any other content that is common over multiple pages to the master page. Content that is specific to a particular page can be defined in content pages that we will see in the next section. Master pages are transparent to the users and when a request is made to the URL of the content page, ASP.NET merges the content of the content page with that of the master page and renders the resulting page. Unlike ordinary ASPX pages, a Web server does not serve a master page and if a user makes a request to the master page, the server returns an error message (see Figure 1).

Master pages are like any other ASP.NET pages with a couple of exceptions. They are identified by a .master file extension. Listing 1 (the code is online at www.sys-con.com/dotnet/source.cfm) is an example of a simple master page. Note that instead of the familiar page directive <[email protected]%> in a normal ASPX page, the master page has a <[email protected] %> directive. Master pages define ContentPlaceholder controls that act as placeholders where content from the content page will be inserted. ContentPlaceholder control is specific to master pages and cannot be declared in a content page. In this example we have defined one ContentPlaceholder control identified as ContentPlaceholder1. A master page can define zero to any number of ContentPlaceholder controls.

Content Pages
The content page is the actual page that a user will request from the server. Content pages are like typical ASPX pages and have a .ASPX extension. However, they differ from an ordinary ASPX page in two ways. The first difference is that a content page has to be associated with a master page, which is done by setting the MasterPageFile attribute in the page directive. Second, all of the content in a Web page must be defined inside a new content control. Any content that is defined outside the content control results in an error. The content control in turn has to be mapped to the Contentplaceholder controls that have been defined in the Master page. Listing 2 shows a content page that refers to Sample.master as its master page. In this example the content page defines a content control called Content1. This content control in turn is mapped to the ContentPlaceholder ContentPlaceHolder1 of the master page by setting the ContentPlaceHolderID.

Sequence of Events
Just like regular ASPX pages, master pages and content pages have events that are fired during the page life cycle. They can also have user controls that need to be initialized. The list below shows the sequence of events in a content page that references a master page.

  1. Controls in the master page are initialized
  2. Controls in the content page are initialized
  3. Master page is initialized
  4. Content page is initialized
  5. Content page loads
  6. Master page loads
  7. Master page controls load
  8. Content page controls load
Creating a Master Page and a Content Page
Now that we have seen what a master page and a content page are, let's see how to create a master and content page using Visual Studio .NET 2005 Beta. Visual Studio allows us to add master pages by choosing an item of type Master Page in the Add New Item option. It also gives us the option to have a code behind page associated with the master page and also select the language of the page. In Figure 2, I add a master page called MyMaster1.master using the Add New Item dialog.

To the master page that I just created, I have added an image, footer, and two content placeholders. Each of the ContentPlaceholder controls that has been added has a unique ID which will be referred to by the content page to insert its content. Listing 3 shows the markup and Figure 3 shows the design view of the master page that I have created. Any content page that uses this master page will automatically inherit the image, the heading, and the footer.

Now that we have created the master page, let's go ahead and create a content page using the Add New Item option in Visual Studio .NET 2005 Beta (see Figure 4). A content page is just an ordinary Web form and Visual Studio .NET 2005 Beta does not have a special type called content page. When we create the content page, the Add New Item dialog, however, gives us the option to select the master page that will be referenced by the Web form. Once we select this option, Visual Studio presents us with a dialog box that lists all the master pages in the Web site (see Figure 5). Figure 6 shows the design view of the content page that we have just created. You will notice that all the master page content is grayed out and cannot be edited. Listing 4 shows the markup of the content page we just created. The only editable portion in the content page is between the <asp:Content> tags. Each of these content tags is linked to ContentPlaceholder of the master page by setting the ContentPlaceHolderID for the content control. In Listing 4, Content1 is mapped to ContentPlaceholder1 of the master page and Content2 is mapped to ContentPlaceholder2 of the master page. Content control in turn can contain other controls. In this example I have added some text in each of the content tags. Figure 7 shows the browser rendering of the content page.

Nesting Master Pages
Master pages can be nested and can have one master page refer to another as its master. Nested master pages are very useful while designing Web sites with different sections where each individual section has to have its own layout and at the same time be consistent with the overall appearance of the Web site. For example, in a corporate Web site we could have a master page that could define the global menu and a master page for each department that would define the departmental menu. Nesting the department master page and the corporate master page would allow us to combine the two menus. Visual Studio .NET 2005 Beta, however, does not provide designer support for nested master pages.

Let's look at how to create a nested master page with the help of an example. Listing 5 shows the parent master page, ParentMaster.master. This parent master page is then referred to by the child master page (see Listing 6). As you can see, the child master page is not very different from the parent master page. They have the same .master extension; however, the child master page has a content control that is mapped to the ContentPlaceHolder control defined in the parent master page. The child master page can also define ContentPlaceHolder controls of its own to display content of the content page that refers to this page as its master. The child master page in our example defines a content control that is mapped to ContentPlaceHolder1 of the master page. It defines a Contentplaceholder control of its own ChildContentPlaceHolder1 to which the content page will map its content. Listing 7 is the content page that refers to the child master page as its master page. Figure 8 shows the rendering of the content page that uses nested master pages.

Configuring a Site to Use Master Pages
Instead of giving the master attribute in the page directive of each and every page in a Website, ASP.NET 2.0 gives you the option to set the master page in the Web.config file. This is very useful in large Web sites as it gives the developers the flexibility to make the change at one place and apply it across the site. The code snippet below shows how to set the master page in the web.config file:

<system.web>
<pages masterPageFile="MyMaster1.master" />
</system.web>

A couple of things need to be pointed out about setting master pages through the web.config file. First, if the content page has a master page explicitly set in its page directive, that master page assumes precedence over the one set in the web.config file. If there are multiple master page settings in different web.config files, the master page setting in the immediate folder overrides the other setting similar to how in an application with multiple sub- folders, the setting of the web config in the immediate folder takes precedence over the others.

Accessing Master Page Controls from Content Pages
The developer may need to access the controls in the master page for many reasons. One could be to display a value that is relevant to the content page. ASP.NET 2.0 gives you multiple options to achieve this. The first step is to get a reference to the master page. In a content page, the Master property returns the reference to the master page. Once we have obtained the reference to the master page, it is now possible to refer to the controls of the master page. We will look at two approaches. The first approach is early binding, where the control is declared as a public property in the master page. Listing 8 shows the master page where we first expose the text of control Label2 as a public property LabelText. We then access and set the value of LabelText in the page load event of the content page as shown in Listing 9. Another thing to point out is the strong typed reference to the Master page using the <[email protected]%> directive in the Content page. This explicitly casts the value of the master property to the master page object which in our case is AccessMasterProperties.

The second approach is the late binding approach. Here we make use of the familiar FindControl method. We get a reference to a label control in the master page and change the text value from the content page. We search for the label by its ID which in this case is Label1 and then cast it to a label control and set the value for the text.

Dynamically Changing Master Pages
ASP.NET 2.0 allows the developer to change the master page associated with a content page dynamically at run-time. This is very useful if the developer would like to give the users the flexibility of choosing the master pages. The master page for a content page can be set programmatically by assigning a value to the MasterPagefile property of the page. However, this dynamic assignment can be done only in the preinit event of the content page since this is the earliest event that occurs in the page execution life cycle. If we attempt to set the master page file in events like pageload, it would result in an exception. Listing 10 shows an example where we have a dropdown list with the available master pages. On clicking the button we redirect the response to the same page and pass the value of the master page to be set as a request string. The MasterPagefile is then set in the preinit event.

Device-Specific Master Pages
ASP.NET 2.0 pages and controls have built-in support that enables them to automatically render appropriate content depending on the browser and the device that has requested the page. Master pages also support similar behavior. We can create a master page specifically for a device or a browser and in the content page instead of binding to a single master page. We can bind them to number of master pages, each of them specific to a particular device. The binding is qualified with the device name. Listing 11 shows a content page that is bound to two master pages, one for Internet explorer and another for mozilla. The Internet Explorer master page is prefixed with ie and the one for Mozilla is prefixed with Mozilla. These browser prefixes are defined in the browsercaps section of the machine.config file. Depending upon the browser requesting the page, the content page is bound to the appropriate master page. Figures 9 and 10 show the rendering of the content page when it is requested through the two different browsers, Mozilla and Internet Explorer. As you see, ASP.NET 2.0 has automatically chosen the appropriate master page.

Conclusion
In this article we looked at the concept of master pages and saw how they allow the developer to easily create reusable page layouts. It also greatly simplifies maintenance as it is now possible to make changes at one place and propagate them throughout the Web site. I am sure that this feature will have a significant impact on how ASP.NET applications are built in the future.

More Stories By Jeevan Murkoth

Jeevan Murkoth is a Microsoft Certified Solutions Developer (MCSD) in .NET (Early Achiever) and a Microsoft Certified Application Developer (MCAD) in .NET. He currently consults for Tennessee Valley Authority and lives in Chattanooga, TN. He has an MS in Management Information Systems from Texas Tech University.

Comments (1) View Comments

Share your thoughts on this story.

Add your comment
You must be signed in to add a comment. Sign-in | Register

In accordance with our Comment Policy, we encourage comments that are on topic, relevant and to-the-point. We will remove comments that include profanity, personal attacks, racial slurs, threats of violence, or other inappropriate material that violates our Terms and Conditions, and will block users who make repeated violations. We ask all readers to expect diversity of opinion and to treat one another with dignity and respect.


Most Recent Comments
Mujtaba Syed 12/14/04 03:48:48 PM EST

Nice article.

@ThingsExpo Stories
What does it look like when you have access to cloud infrastructure and platform under the same roof? Let’s talk about the different layers of Technology as a Service: who cares, what runs where, and how does it all fit together. In his session at 18th Cloud Expo, Phil Jackson, Lead Technology Evangelist at SoftLayer, an IBM company, spoke about the picture being painted by IBM Cloud and how the tools being crafted can help fill the gaps in your IT infrastructure.
SYS-CON Events announced today the Enterprise IoT Bootcamp, being held November 1-2, 2016, in conjunction with 19th Cloud Expo | @ThingsExpo at the Santa Clara Convention Center in Santa Clara, CA. Combined with real-world scenarios and use cases, the Enterprise IoT Bootcamp is not just based on presentations but with hands-on demos and detailed walkthroughs. We will introduce you to a variety of real world use cases prototyped using Arduino, Raspberry Pi, BeagleBone, Spark, and Intel Edison. Y...
Why do your mobile transformations need to happen today? Mobile is the strategy that enterprise transformation centers on to drive customer engagement. In his general session at @ThingsExpo, Roger Woods, Director, Mobile Product & Strategy – Adobe Marketing Cloud, covered key IoT and mobile trends that are forcing mobile transformation, key components of a solid mobile strategy and explored how brands are effectively driving mobile change throughout the enterprise.
19th Cloud Expo, taking place November 1-3, 2016, at the Santa Clara Convention Center in Santa Clara, CA, will feature technical sessions from a rock star conference faculty and the leading industry players in the world. Cloud computing is now being embraced by a majority of enterprises of all sizes. Yesterday's debate about public vs. private has transformed into the reality of hybrid cloud: a recent survey shows that 74% of enterprises have a hybrid cloud strategy. Meanwhile, 94% of enterpri...
If you had a chance to enter on the ground level of the largest e-commerce market in the world – would you? China is the world’s most populated country with the second largest economy and the world’s fastest growing market. It is estimated that by 2018 the Chinese market will be reaching over $30 billion in gaming revenue alone. Admittedly for a foreign company, doing business in China can be challenging. Often changing laws, administrative regulations and the often inscrutable Chinese Interne...
Fact is, enterprises have significant legacy voice infrastructure that’s costly to replace with pure IP solutions. How can we bring this analog infrastructure into our shiny new cloud applications? There are proven methods to bind both legacy voice applications and traditional PSTN audio into cloud-based applications and services at a carrier scale. Some of the most successful implementations leverage WebRTC, WebSockets, SIP and other open source technologies. In his session at @ThingsExpo, Da...
An IoT product’s log files speak volumes about what’s happening with your products in the field, pinpointing current and potential issues, and enabling you to predict failures and save millions of dollars in inventory. But until recently, no one knew how to listen. In his session at @ThingsExpo, Dan Gettens, Chief Research Officer at OnProcess, will discuss recent research by Massachusetts Institute of Technology and OnProcess Technology, where MIT created a new, breakthrough analytics model f...
Personalization has long been the holy grail of marketing. Simply stated, communicate the most relevant offer to the right person and you will increase sales. To achieve this, you must understand the individual. Consequently, digital marketers developed many ways to gather and leverage customer information to deliver targeted experiences. In his session at @ThingsExpo, Lou Casal, Founder and Principal Consultant at Practicala, discussed how the Internet of Things (IoT) has accelerated our abil...
24Notion is full-service global creative digital marketing, technology and lifestyle agency that combines strategic ideas with customized tactical execution. With a broad understand of the art of traditional marketing, new media, communications and social influence, 24Notion uniquely understands how to connect your brand strategy with the right consumer. 24Notion ranked #12 on Corporate Social Responsibility - Book of List.
Cloud computing is being adopted in one form or another by 94% of enterprises today. Tens of billions of new devices are being connected to The Internet of Things. And Big Data is driving this bus. An exponential increase is expected in the amount of information being processed, managed, analyzed, and acted upon by enterprise IT. This amazing is not part of some distant future - it is happening today. One report shows a 650% increase in enterprise data by 2020. Other estimates are even higher....
Adobe is changing the world though digital experiences. Adobe helps customers develop and deliver high-impact experiences that differentiate brands, build loyalty, and drive revenue across every screen, including smartphones, computers, tablets and TVs. Adobe content solutions are used daily by millions of companies worldwide-from publishers and broadcasters, to enterprises, marketing agencies and household-name brands. Building on its established design leadership, Adobe enables customers not o...
Everyone knows that truly innovative companies learn as they go along, pushing boundaries in response to market changes and demands. What's more of a mystery is how to balance innovation on a fresh platform built from scratch with the legacy tech stack, product suite and customers that continue to serve as the business' foundation. In his General Session at 19th Cloud Expo, Michael Chambliss, Head of Engineering at ReadyTalk, will discuss why and how ReadyTalk diverted from healthy revenue an...
Cognitive Computing is becoming the foundation for a new generation of solutions that have the potential to transform business. Unlike traditional approaches to building solutions, a cognitive computing approach allows the data to help determine the way applications are designed. This contrasts with conventional software development that begins with defining logic based on the current way a business operates. In her session at 18th Cloud Expo, Judith S. Hurwitz, President and CEO of Hurwitz & ...
The Internet of Things will challenge the status quo of how IT and development organizations operate. Or will it? Certainly the fog layer of IoT requires special insights about data ontology, security and transactional integrity. But the developmental challenges are the same: People, Process and Platform and how we integrate our thinking to solve complicated problems. In his session at 19th Cloud Expo, Craig Sproule, CEO of Metavine, will demonstrate how to move beyond today's coding paradigm ...
The Transparent Cloud-computing Consortium (abbreviation: T-Cloud Consortium) will conduct research activities into changes in the computing model as a result of collaboration between "device" and "cloud" and the creation of new value and markets through organic data processing High speed and high quality networks, and dramatic improvements in computer processing capabilities, have greatly changed the nature of applications and made the storing and processing of data on the network commonplace.
Digital transformation is too big and important for our future success to not understand the rules that apply to it. The first three rules for winning in this age of hyper-digital transformation are: Advantages in speed, analytics and operational tempos must be captured by implementing an optimized information logistics system (OILS) Real-time operational tempos (IT, people and business processes) must be achieved Businesses that can "analyze data and act and with speed" will dominate those t...
Almost two-thirds of companies either have or soon will have IoT as the backbone of their business in 2016. However, IoT is far more complex than most firms expected. How can you not get trapped in the pitfalls? In his session at @ThingsExpo, Tony Shan, a renowned visionary and thought leader, will introduce a holistic method of IoTification, which is the process of IoTifying the existing technology and business models to adopt and leverage IoT. He will drill down to the components in this fra...
As ridesharing competitors and enhanced services increase, notable changes are occurring in the transportation model. Despite the cost-effective means and flexibility of ridesharing, both drivers and users will need to be aware of the connected environment and how it will impact the ridesharing experience. In his session at @ThingsExpo, Timothy Evavold, Executive Director Automotive at Covisint, will discuss key challenges and solutions to powering a ride sharing and/or multimodal model in the a...
Internet of @ThingsExpo, taking place November 1-3, 2016, at the Santa Clara Convention Center in Santa Clara, CA, is co-located with the 19th International Cloud Expo and will feature technical sessions from a rock star conference faculty and the leading industry players in the world and ThingsExpo Silicon Valley Call for Papers is now open.
I'm a lonely sensor. I spend all day telling the world how I'm feeling, but none of the other sensors seem to care. I want to be connected. I want to build relationships with other sensors to be more useful for my human. I want my human to understand that when my friends next door are too hot for a while, I'll soon be flaming. And when all my friends go outside without me, I may be left behind. Don't just log my data; use the relationship graph. In his session at @ThingsExpo, Ryan Boyd, Engi...