Including Standard Content with User Controls

Including Standard Content with User Controls

You can use a user control to redisplay static content on multiple ASP.NET pages. For example, most Web sites have a standard header and footer that appear at the top and bottom of every page. With user controls, you can create the standard header and footer once and use the same user controls on multiple pages.

The advantage of using user controls to display the same content on multiple pages is that you can easily update the content if it ever changes. For example, if your Web site logo changes, you need to change only one file rather than hundreds of files.

ASP Classic Note

In previous versions of Active Server Pages, #INCLUDE files were used to display static content on multiple pages. You can still use #INCLUDE files with ASP.NET, but user controls offer much more functionality.

To build a user control, you simply need to create a file that has the extension .ascx . You can place any static content in a user control file that you want.


User controls have the special .ascx extension so that they cannot be opened directly in a Web browser. Being able to open a user control file directly would create potential security risks. If you attempt to open a user control file, you receive a This type of page is not served . message.

Listing 5.1 contains a simple user control that represents a standard Web site page header.

Listing 5.1 SimpleHeader.ascx
 <html> <head><title>Global Super Company</title></head> <body> <h2>Global Super Company</h2> <i>We mean business!</i> <hr> 

The C# version of this code can be found on the CD-ROM.

Notice that Listing 5.1 does not contain anything special. It includes standard opening HTML tags and a little bit of text.

After you create a user control, you can include it in any other ASP.NET page in your Web site. For example, the page in Listing 5.2 contains the SimpleHeader.ascx user control.

Listing 5.2 HomePage.aspx
 <%@ Register TagPrefix="SuperCompany" TagName="Header"   Src="SimpleHeader.ascx" %> <Supercompany:Header   ID="ctlHeader"   Runat="Server" /> Welcome to our home page! </body> </html> 

The C# version of this code can be found on the CD-ROM.

When the page in Listing 5.2 is displayed, the contents of the user control are also displayed (see Figure 5.1).

Figure 5.1. Registering a user control.


The first line of Listing 5.2 contains a Register directive. You must register a user control on a page before you can start using it.

The page in this listing uses three attributes of the Register directive:

  • TagPrefix ” The alias to associate with the user control's namespace

  • TagName ” The alias to associate with the user control's class

  • Src ” The virtual path to the file containing the user control

The TagPrefix attribute enables you to assign a unique namespace to the user control. If you add another user control to the page with the same TagName , you could still distinguish between the controls with the TagPrefix .

The TagName attribute enables you to name your custom control. You use this name when creating an instance of the user control on the page.

The Src attribute specifies the path to the user control file. If the user control is located in the same directory as the containing page, you can simply provide the filename. If the user control is located in another directory, you need to provide either a relative or absolute path to the file.

After you register the user control on the page, you can start using the control just like any other ASP.NET control. In Listing 5.2, you declared the control on the page by using the following tag:

 <Supercompany:Header   ID="ctlHeader"   Runat="Server" /> 

When the page is rendered, the control displays the contents of the SimpleHeader.ascx file.


You do not always need to include a user control within a <Form Runat="Server"> tag. You need to include a user control within a form tag only when you want the control to participate in view state or when it includes other controls that require it.

You can use the same user control multiple times within a single ASP.NET page. The only requirement is that each instance has a unique ID.

Imagine that you created a complicated page divider using multiple HTML elements. You can place all the HTML elements into a user control and redisplay the divider multiple times on a page.

Listing 5.3 contains a user control that represents a page divider built from an HTML <table> tag.

Listing 5.3 Divider.ascx
 <p> <table width="90%" cellpadding="2" cellspacing="0" border="1" bordercolor="red"> <tr>   <td bgcolor="orange" Height="3">   </td> </tr> </table> <p> 

The C# version of this code can be found on the CD-ROM.

This divider is displayed multiple times in the page contained in Listing 5.4 (see Figure 5.2 for the output of this page).

Listing 5.4 UserControlsDivider.aspx
 <%@ Register TagPrefix="SuperCompany" TagName="Divider"   Src="divider.ascx" %> <html> <head><title>UserControlsDivider.aspx</title> <body> Here is some text... <SuperCompany:Divider   id="ctlDivider1"   Runat="Server" /> Here is some more text... <SuperCompany:Divider   id="ctlDivider2"   Runat="Server" /> Yet some more text... <SuperCompany:Divider   id="ctlDivider3"   Runat="Server" /> </body> </html> 

The C# version of this code can be found on the CD-ROM.

Figure 5.2. Displaying a single user control multiple times.


ASP.NET Unleashed
ASP.NET 4 Unleashed
ISBN: 0672331128
EAN: 2147483647
Year: 2003
Pages: 263

Similar book on Amazon © 2008-2017.
If you may any questions please contact us: