❑ Listing books: One control might provide a single column with limited options for sorting the
list, another control could support complex sorting options, another control might format the
user into a rigid grid format with a single line for each book, and yet another control might
allow the list to “snake” through multiple columns, allowing more books to be listed on a page.
❑ Displaying book information: Different controls might vary in the amount of information
displayed about a book or which information stands out. One control might be formatted so that
information about book size and weight stands out for retail buyers concerned about reducing
shipping costs — information that the typical reader isn’t interested in.
With those controls created, you could add a page to your application that consists of two areas:
❑ One area at the top of the page to place one of the search criteria controls
❑ An area below that to put one of the controls for listing books
Users could draw from your toolkit of Web Parts to build the search page that they want. Users would
be able to put the search criteria Web Part that most meets their needs at the top of the page and put the
listing Web Part they want below that. To work with the listing control, they could add the book infor-
mation Web Part that supports them best. This is a solution aimed purely at giving users the opportunity
to create the application they need.
Providing for Personalization
In order to implement customization, you also need personalization. Your users won’t be happy if they have
to recreate their application each time that they return to your site, or if, when they return, they get some
other user’s customization. Customization is of no use unless the application remembers what changes
a user has made and associates those changes with the user that made them. Fortunately, ASP.NET 2.0
comes with a personalization framework. The ASP.NET 2.0 personalization framework allows you to
implement an application that tracks users and the choices they make so that when the users return to
your application, they find their own customizations waiting for them. Each user is connected to his
customized application after he logs on with little effort on your part.
This description makes personalization sound like a “nice-to-have” feature. In fact, personalization is
really just the extension of identity-based security, which is essential in building an application. When
users access your Web site, they are automatically logged on to your Web site’s server. The logging in
process assigns the user an identity, even if it’s only the default “anonymous user” assigned by IIS. If
you’ve turned off the capability to log on as the anonymous user, then the user may be silently logged
on using whatever credentials are currently available (for instance, the user ID and password that the
The personalization framework has three main components:
❑ Login controls
❑ Membership providers
❑ Profile services and providers
The first components of the personalization framework that a user encounters are ASP.NET 2.0’s new
login and user controls. Rather than write all the code necessary to log in a user, you can simply drag and
drop the new login controls to a Web page. These controls handle all the typical tasks associated with the
log on process (including sending forgotten passwords to users). For personalization, these controls allow
a user to be assigned an identity. Separate from this process, the site administrator has to register with the
personalization datastore the identities that users can be assigned. Figure 1-6 illustrates the three elements
of the personalization framework: login controls, membership providers, and profile services.
19
Creating Your Own Controls
05_57860x ch01.qxd 10/4/05 9:26 PM Page 19
Figure 1-6
Within the area of user management, some other features of SharePoint have also migrated into
ASP.NET 2.0. Within SharePoint, it’s possible for authorized users to create new SharePoint sites, new
users, new pages, and perform other administrative tasks.
In ASP.NET 2.0, as part of the personalization framework, it’s possible to implement user management
functions within the site itself (although you still can’t create a whole new Web site from within an
application). ASP.NET even comes with a set of pre-defined user administration pages that you can
incorporate into your site.
Logging in is more than just assigning identities. For sites that have a small number of users, implement-
ing personalization on an identity-by-identity basis is a viable choice. However, as the number of
identities increases, the costs of maintaining personalized information increases. While costs increase
with the number of identities, the benefits of personalization don’t increase. In all likelihood, the cus-
tomizations made for one identity will be applicable to other identities. In any user community, you can
probably break your user community up into several groups. This can be handled by assigning individual
users to roles and implementing customizations on a role-by-role (group) basis. As a result, you need a
mechanism that not only assigns identities to users but also assigns users to roles.
trols. I also show you how to use these controls as Web Parts and how to extend custom controls to let
users customize your site. Along the way, you’ll also see how easy it is to build user controls—and both
how to add custom control features to user controls and use them as Web Parts.
While it’s good to know about controls, what’s important to you is what you do with those controls.
You’ve seen how these ASP.NET tools support two different scenarios:
❑ Reusability: Controls support reusability in the user interface (or presentation) layer rather than in
the business rules layer. Like other reusability tools, controls enable you to provide a standardized
set of services and improve your own productivity.
❑ Customization: Web Parts allow you to support customization to a degree that simply wasn’t
possible in earlier versions of ASP and ASP.NET. With Web Parts, you can allow your users to
create customized versions of existing pages, or to create pages that were not intended to be
included in the application. While this empowers your users, it also opens up a whole new set
of challenges for the developer, both in determining what Web Parts the user community will
need and ensuring that those Web Parts will work in all the different ways that users want.
Finally, in order to support customization, you also need personalization: the ability to keep track of a
user’s choices, remember those changes from one session to another, and connect the user to his cus-
tomized pages. Personalization is the extension of identity-based security into application development.
Over the rest of this book, you’ll see how to build custom controls, user controls, and Web Parts.
The personalization framework allows you to store, as part of a profile, the Web Part
customizations associated with some identity. The membership provider allows you
to keep track of which identities are being used. The login controls assign identities
to users.
21
Creating Your Own Controls
05_57860x ch01.qxd 10/4/05 9:26 PM Page 21
05_57860x ch01.qxd 10/4/05 9:26 PM Page 22
Creating
Customizable Pages
The capability to add customization to your Web application using Web Parts is completely new in
ASP.NET 2.0. Before plunging in to the details of creating controls, it’s worthwhile to take the time
controls (or just the framework controls) to distinguish them from the controls that you’ll create or the
standard ASP.NET controls that come with .NET. These framework controls include:
❑ WebPartManager: The control that enables a page for customization.
❑ Zones: These controls define the sections of a page that users can customize. Different kinds of
WebPartZones support different kinds of Web Part controls, as follows:
❑ WebPartZone: For holding controls (either standard ASP.NET controls or controls that
you create).
❑ CatalogZone: For holding Web Part framework controls that list the controls that you
can add to WebPartZones.
❑ EditorZone: For holding editors that allow you to modify controls on the page.
❑ Editors: The tools that allow the user to set properties on a control or otherwise modify a control.
❑ AppearanceEditorPart: Allows the user to set the values of specific properties related to
the way that a control is displayed.
❑ BehaviorEditorPart: Allows the user to set the values of specific properties on a control
in shared mode, which causes the changes to be made for all users instead of just for the
user making the change.
❑ LayoutEditorPart: Allows the user to move controls from one location on the page to
another.
❑ PropertyGridEditorPart: Allows the user to set any custom properties on a control (that
is, those properties on a custom control that are not inherited from a base control).
❑ Catalogs: The tools that list the controls that can be added to the page, including:
❑ DeclarativeCatalogPart: Lists controls that are declared in the HTML in the page but
haven’t yet been added to the page.
❑ PageCatalogPart: Lists controls that are already added to the page but aren’t visible to
the user (controls that are closed).
❑ ImportCatalogPart: Lists controls that can be added to the page by importing from files
on your server.
24
06_57860x ch02.qxd 10/4/05 9:24 PM Page 24
❑ ConnectionsZone: Holds connection objects that represent connections between controls in a
framework controls, you must make sure that the WebPartManager is at the top of
the page, before any of the other framework controls.
25
Creating Customizable Pages
06_57860x ch02.qxd 10/4/05 9:24 PM Page 25
Chapter 2
4. Click the ASPNETDB.MDF file to select it.
5. Click the Add button to add the file to Solution Explorer.
Clicking the plus sign beside the MDF file entry will let you explore the tables that hold personalization
data as you would with any other database that you attach to your project.
Because the personalization data is held in a database on the server (rather than, for instance, cookies
that are sent to the browser) a user’s customizations are maintained even if the user accesses the site
from different browsers or different computers.
While this is all that you need to get started with personalization and customization, in Chapter 10 you
learn more about what you can with ASP.NET’s personalization infrastructure (including how to specify
which database management system will store your site’s personalization data).
With the WebPartManager on the page, you must next set up the zones on the page where customization
will be allowed. Because customization happens only within these zones, to protect parts of your page
from customization simply make sure those parts of the page aren’t in a zone.
In order to create a zone in Visual Studio 2005, you just drag a WebPartZone control onto your Web
page. The samples used in this chapter are added to a page called CustomizablePage.ASPX. After the
WebPartZone is on the page, you can control the position of the zone by selecting Layout ➪ Position ➪
Absolute from the Visual Studio menus and dragging the WebPartZone to where you want it. You can
resize the WebPartZone by dragging its sides as you would with any other control. You can place as
many WebPartZones onto a page as you want. Figure 2-1 shows a page with three WebPartZones.
Figure 2-1
If you’re working outside of Visual Studio 2005, you can add WebPartZones to your page using the
asp:WebPartZone element. The following code shows the tags for the page shown in Figure 2-1:
26
06_57860x ch02.qxd 10/4/05 9:24 PM Page 26
After you’ve added a WebPartZone to a page, in Visual Studio .NET you can add controls into the lower
part of the zone by dragging them from the toolbox. Figure 2-2 shows a WebPartZone that has had a
text box and a button dragged into it. The bad news is that after you drag a control into a zone, you can’t
position the control within the zone—controls are inserted either beside or underneath each other (this is
controlled by the zone’s LayoutOrganization property). You can’t use absolute positioning within a zone.
In this chapter, only standard ASP.NET controls are used in a zone. However, you can put just about
anything in a zone: HTML controls, plain text, custom controls, and (as you’ll see) user controls.
27
Creating Customizable Pages
06_57860x ch02.qxd 10/4/05 9:24 PM Page 27
Chapter 2
Figure 2-2
When you add a control to the WebPartZone it should appear as in Figure 2-2. However, if the control
appears at the top of the WebPartZone, it means that the control has been added with absolute positioning.
(In other words, the first option in the Position options dialog box reached through Layout➪Position➪
AutoPosition Options has been set to Absolutely positioned.) To fix the problem in Visual Studio 2005, click
the control and from the Layout ➪ Position menu, select the Not Set option (even if it’s already selected).
Or, switch to HTML view and delete “position: absolute;” from the control’s Style attribute. You may have
similar problems if you use relative positioning but the solution is the same: delete the position setting in
your control’s Style attribute.
To add the same controls outside of Visual Studio 2005’s drag-and-drop environment, place the tags for
the button and a text box inside a <ZoneTemplate> element inside the WebPartZone. As the following
example shows, while WebPartZone elements use absolute positioning values in their style attribute, the
controls within a WebPartZone don’t:
<asp:WebPartZone ID=”DataEntry” Runat=”server”
VerbButtonType=”Link” HeaderText=”Data Entry”
style=”z-index: 67; left: 72px; position: absolute; top: 88px”>
<ZoneTemplate>
<asp:TextBox Runat=”server” ID=”TextBox1”></asp:TextBox>
<asp:Button Runat=”server” Text=”Button” ID=”Button1” />
Initially, as shown in Figure 2-2, the title bar for a control contains the word “Untitled.” For a generic
control, you can’t change this value from the Visual Studio Property List — but you can change the
title from code. In code, individual controls inside a zone can be accessed through a zone’s WebParts
collection. The following Visual Basic 2005 code, for instance, sets the Title property of the first control in
a WebPartZone called znDataEntry (the result is shown in Figure 2-3):
Me.znDataEntry.WebParts(0).Title = “Search”
In C#, the equivalent code looks like this:
this.znDataEntry.WebParts[0].Title = “Search”;
You can also access the controls inside a zone through the zone’s WebParts collection by using the Id
property of the individual controls. This Visual Basic 2005 code sets the title for a control with the Id set
to txtTopic in the zone znDataEntry:
Me.znDataEntry.WebParts(“txtTopic”).Title = “Search”
In C#:
this.znDataEntry.WebParts[“txtTopic”].Title = “Search”;
29
Creating Customizable Pages
06_57860x ch02.qxd 10/4/05 9:24 PM Page 29
Chapter 2
Figure 2-3
When a control is accessed through the WebParts collection, a WebPart object is returned. You can use
this object to set properties relevant to a Web Part, as this Visual Basic 2005 code does by setting the Title
property:
Dim wp As WebPart
wp = Me.znSearch.WebParts(“TextBox1”)
wp.Title = “Topic”
The same code in C# looks like this:
WebPart wp;
wp = this.znSearch.WebParts[“TextBox1”];
wp.Title = “Topic”;
You can also set the title of a control in a WebPartZone in the source view of your page by adding a title
1. Create a WebForm page in an ASP.NET 2.0 project.
2. Drag a WebPartManager control to the page.
3. Drag a WebPartZone control to the page.
4. Drag a WebForm TextBox into the WebPartZone. The page should look as it appears in Figure 2-4.
5. Browse the page in Internet Explorer by right-clicking on the page in Solution Explorer and
selecting View in Browser.
6. Customize the page by selecting the Minimize action from the text box’s menu (click on the
small down arrow to display the menu). The text box disappears and the Minimize action
changes to Restore. You have customized your page.
7. Shut down the browser.
8. View the page in Internet Explorer again. You will see that the text box is still minimized.
ASP.NET has kept track of your customization.
This is a very simple customization application. Before you can take full advantage of the customization
facilities in ASP.NET, you’ll need to drill a little deeper into zones and controls and how Web Parts interact
with them.
31
Creating Customizable Pages
06_57860x ch02.qxd 10/4/05 9:24 PM Page 31
Chapter 2
Figure 2-4
Configuring a Zone
WebPartZones support the standard properties for all WebForm controls (such as AccessKey, BackColor,
and so on). However, there are several properties that are not only unique to the WebPartZone controls
but are essential in understanding how the controls that you will create will work with a customizable
page. Also critical, from the point of view of a Web Part developer, is ensuring that the settings are at the
WebPartZone level that controls the behavior of the Web Parts in the zone.
Configuring Customization Verbs
The most important customization properties for a WebPartZone are the *verb properties: CloseVerb,
ConnectVerb, DeleteVerb, EditVerb, ExportVerb, HelpVerb, MinimizeVerb, and RestoreVerb. These verbs
represent the customization actions that can be performed on a control in a zone at run time, two of
property has been set to Min. so that “Min.” displays instead of the default Minimize. The Description
property has been set to Minimize ‘{0}”s display. Because the control’s name is txtTopicName and the page
is displaying in Internet Explorer, the tooltip displays as “Minimize txtTopicName’s Display.”
Figure 2-5
33
Creating Customizable Pages
06_57860x ch02.qxd 10/4/05 9:24 PM Page 33
Chapter 2
It’s important to remember that, in the end, the display of the page is controlled by the browser.
Different browsers may result in slightly different displays.
In addition to customizing the verbs that manage customization, you can turn off some of the customiza-
tion’s flexibility by setting the AllowLayoutChange property. When AllowLayoutChange is set to False,
users can’t add, remove, or move Web Parts in the zone (Web Parts in the zone can still be changed and
modified).
Configuring the Verb Menu
The drop-down menu in the Web Part’s title bar is called Verb Menu. The Verb Menu lists customization
activities that can be performed on the control. By default, all that appears is a small down arrow; click-
ing the arrow causes the list of verbs for the control to be displayed.
In the zone, you can use the following properties to control how the Verb Menu is displayed:
❑ MenuLabelText: Sets the text displayed in the control’s title bar before the menu is displayed.
❑ MenuLabelStyle, MenuLabelHoverStyle: Control the style to be applied to the menu label and
the style to be used on the label when the user hovers the mouse pointer over it.
❑ MenuVerbStyle, MenuVerbHoverStyle: Control the style to be applied to the menu when
the menu is displayed and the style to be used when the user hovers the mouse pointer over
the menu.
❑ MenuCheckImageURL, MenuCheckImageStyle: The currently selected Verb in the menu is
displayed with a checkmark beside it. These two properties control the image used for the
checkmark and the style applied to it.
❑ MenuPopupImageURL: Sets the URLs for the image displayed as background for the menu.
Figure 2-6 shows a verb menu for a zone containing a custom Web Part with a single verb: Edit, appearing
zone’s style options. After applying one of the Auto Format styles, you can remove it by selecting the
Remove Formatting option from the list.
35
Creating Customizable Pages
06_57860x ch02.qxd 10/4/05 9:24 PM Page 35
Chapter 2
Figure 2-7
Figure 2-8
Turning on Customization
In its default mode, a page won’t let a user do much more than minimize or close a control. In order to
let the user take advantage of more advanced customizations, you must put the WebPartManager on the
page into the appropriate mode. A WebPartManager can be in one of five standard modes:
❑ Browse: This is the default mode for a page and displays the contents of the page. Only the
Close and Minimize actions can be performed.
❑ Edit: Displays any special editing controls and allows the user to edit the controls on the page.
❑ Design: Displays the zones themselves and allows users to drag controls inside a zone and
between zones.
❑ Catalog: Displays any catalog type controls and allows users to add or remove controls from
the page.
❑ Connect: Displays any special user interface elements related to connecting controls and allows
the user to connect or disconnect parts.
36
06_57860x ch02.qxd 10/4/05 9:24 PM Page 36
When the WebPartManager is in any of these modes, all the WebPartZones on the page are affected.
Once a WebPartManager has been put into any one of these modes, the WebPartManager will stay in
that mode until the WebPartManager is explicitly put into another mode (no matter how many times the
page is requested by the user).
To change the WebPartManager’s mode, you must set the WebPartManager’s DisplayMode property to
any one of five predefined values. They are:
❑ WebPartManger.BrowseDisplayMode
For Visual Basic 2005:
Me.WebPartManager1.DisplayMode = WebPartManager.DesignDisplayMode
For C#:
this.WebPartManager1.DisplayMode = WebPartManger.DesignDisplayMode;
4. Drag two WebPartZones onto the page.
5. Drag a WebForms TextBox into one of the WebPartZones.
6. Drag a WebForms DropDownList into a different WebPartZone. Your page should look something
like Figure 2-9.
Figure 2-9
7. Display the page in Internet Explorer.
8. Click the button on the page to put the WebPartManager into Design mode. Your page should
look like the page in Figure 2-10. The WebPartZones around the controls are visible as are the
WebPartZones titles. The empty WebPartZone is also displayed with its EmptyZoneText.
9. You can now click the controls (in the upper-left corner) and drag the controls into different
zones.
10. After you have moved one or more of the controls to a different zone, shut down Internet
Explorer and return to Visual Studio 2005.
11. Display the page in Internet Explorer. You’ll find that your site has remembered the customiza-
tions you made to the page and displays the controls in the zones where you last dragged them.
Now that you know how to work with WebPartManagers and WebPartZones you’re ready to look at
customizations more advanced than just minimizing and closing controls. These customizations include
the capability to:
❑ Edit the properties for the control
❑ Change the appearance of the control
38
06_57860x ch02.qxd 10/4/05 9:24 PM Page 38
❑ Move controls between zones on the page
❑ Add new controls to the page from a catalog of controls
Figure 2-10
Not all of the customizable options that are available can be used with ASP.NET controls (for
an area that tools can be dragged into. Figure 2-11 shows an AppearanceEditorPart in the EditorZone.
You can drag editor controls such as the AppearanceEditorPart or LayOutEditorPart into the area under
the header.
Figure 2-11
40
06_57860x ch02.qxd 10/4/05 9:24 PM Page 40
By clicking the arrow that appears in the upper-left corner of an EditorZone, you can display the
EditorZone’s Tasks Smart Tag (see Figure 2-12). Checking the View in Browse Mode option in the Tasks
dialog box causes the EditorZone to display as a gray box — this gives you a better view of what your
page will look like when the user isn’t customizing the page.
Figure 2-12
Outside of Visual Studio 2005, you can add an EditorZone to a page by placing these tags in the page:
<asp:EditorZone ID=”EditorZone1” Runat=”server”
Style=”z-index: 39; left: 40px; position: absolute; top: 248px”>
</asp:EditorZone>
To add a part to the EditorZone outside of Visual Studio 2005, you must insert a ZoneTemplate element
inside of the EditorZone element, and then place the tags for the editing part inside of the ZoneTemplate
element. This example shows an EditorZone with an AppearanceEditorPart inside of it:
<asp:EditorZone ID=”EditorZone1” Runat=”server”
Style=”z-index: 39; left: 40px; position: absolute; top: 248px”>
<ZoneTemplate>
<asp:AppearanceEditorPart Runat=”server” ID=”AppearanceEditorPart1” />
</ZoneTemplate>
</asp:EditorZone>
41
Creating Customizable Pages
06_57860x ch02.qxd 10/4/05 9:24 PM Page 41
Chapter 2
After an EditorZone is added to a page, you can put the WebPartManager on the page into Edit mode.
Once the WebPartManager is in Edit mode, all the controls that can be edited will have their Verb Menu