Beginning ASP.NET 4.5 in CSharp and VB Opsylum

290 x CHAPTER 8 USER CONTROLS
How It Works
The design experience of user controls in the Visual Studio IDE is identical to that of pages. You can
use drag and drop; the Toolbox; the Markup, Split, Design Views; and so on. This makes it easy to
work with user controls because you can use all the familiar tools you also use for page development.
The control you just created displays a single image wrapped in an anchor element. In the next section,
you see how to add the user control to the master page so it will be displayed in the Sidebar
element of every page in the site. Later sections in this chapter show you how to add the
other image that you can use to display a horizontal banner in individual content pages.
Adding User Controls to a Content Page or Master Page
To use a user control in a content or master page or in another user control, you need to perform
two steps. First, you need to register the control by adding an @ Register directive to the page or
control where you want the user control to appear. The second step involves adding the tags for the
user control to the page and optionally setting some attributes on it.
A typical @ Register directive for a user control looks like this:
The directive contains three important attributes, described in the following table.
Attribute
Src
TagName
TagPrefix
Description
Points to the user control you want to use. To make it easier to move pages at a
later stage, you can also use the tilde (~) syntax to point to the control from the
application root.
The name for the tag that is used in the control declaration in the page. You’re free
to make up this name, but usually it is the same as the name of the control.
Holds the prefix of the TagName that is used in the control declaration. Just as
ASP.NET uses the asp prefix to refer to its controls, you need to provide a prefix for
your own user controls. By default, this prefix is uc followed by a sequential number,
but you can also change it to your own liking—for example, to your own company
name or a custom abbreviation.
Considering the user control you created in the preceding exercise, your @ Register directive could
look like this:
When the control is registered, you can add it to the page using the TagPrefix:TagName construct,
similar to the way you add standard server controls to a page. Given the @ Register directive for
the banner control, you need the following markup to add the control to your page: