Drilling Into the Menu Control
|Figure 3. Parts of a Menu Control: The figure shows the ASP code that defines a menu, with the various parts labeled.|
The Menu control derives from the System.Web.UI.WebControls.HierarchicalDataBoundControl class. This class acts as a logical container for a Menu control. It's convenient to think of Menu controls as consisting of three parts: control properties
, item style properties
, and items
. Figure 3
shows the ASP code that defines a menu with the three parts labeled.
Looking at Figure 3
, the first section helps you define various properties for the menu control. The second section specifies styles to apply to the various menu item types, and the third section defines the menu items themselves. Note the way the code nests submenu items within the root "Home" menu.
Static and dynamic menus have separate but parallel style properties. Table 1 lists several important Menu control style properties and descriptions.
Table 1. Important Menu Control Properties: The menu lists the name and description of several important Menu control style properties and descriptions.
|Menu item style
||This property controls the appearance of a dynamic menu item when the mouse pointer is positioned over it.
||This property controls the appearance of menu items within a dynamic menu.
||This property controls the appearance of a dynamic menu.
||This property controls the appearance of a dynamic menu item when the user selects it from the menu.
||This property controls the appearance of a static menu item when the mouse pointer is positioned over it.
||This property controls the appearance of the menu items in a static menu.
||This property controls the appearance of a static menu.
||This property controls the appearance of a static menu item when the user selects it from the menu.
Take a closer look at the third section in Figure 3
(Menu Items) section. This section is the core of the Menu control. Each Menu control is made up of a hierarchical tree of menu items, each represented by a MenuItem (corresponding to an
element) object. Menu items at the top level (level 0) are called root menu
items. In Figure 3
, "Home" is the root menu item. A menu item that has a parent menu item is called a child menu
item. For example, "ASP.NET Sites" is a child item in Figure 3
. The Items
collection (the <items>
element) holds all the root menu items. Each root menu has a ChildItems
collection containing the child menu items.
A MenuItem has four important properties: Text, Value, NavigateUrl, and ImageUrl. The Menu control displays the Text property value as the visible name for each menu item. You use the Value property used to store any additional data about the menu item, such as data it should pass to the PostBack event associated with the menu item. When clicked, a menu item can navigate to another Web page indicated by the NavigateUrl property. If you don't set the NavigateUrl property for a menu item, the Menu control simply submits the page to the server for processing when a user clicks that menu item. You're not limited to text menu items, either; using the ImageUrl property, you can optionally display an image in a menu item rather than a simple text string.