思洋互动网站建设学前班

利用Menu控件实现自定义导航（2）2. 从SiteMapDataSource控件获取菜单数据
Menu 控件的菜单数据源如果是 SiteMapDataSource 数据源控件，在 ASP.NET 程序中需要创建此控件，如下所示：

广州网站建设

1. <asp:SiteMapDataSource Id="sitemap" Runat="server"/>

上述标记建立名为 sitemap 的 SiteMapDataSource 数据源控件，在Menu控件中是使用 DataSourceID 属性来指定数据源，如下所示。

广州网站建设

1. <asp:Menu id="Menu1" Runat="Server"
2.    StaticDisplayLevels="2" DataSourceID="sitemap"
3.    StaticMenuItemStyle-VerticalPadding="3"
4.    …  
5.    DynamicHoverStyle-ForeColor="black"/>

【例7-8】演示从SiteMapDataSource控件获取菜单数据方法。
(1) 复制Web站点Ex7_6，修改其名称为Ex7_8。
(2) 在VWD 2008中打开Ex7_8。
(3) 在【解决方案资源管理器】双击Default.aspx，从【工具箱】的【导航】类别中，拖动一个Menu控件放到DIV标记之间。生成的代码如下所示：

广州网站设计

1. <asp:Menu ID="Menu1" runat="server"> </asp:Menu>

(4) 切换到【设计】视图。单击Menu控件的智能标记(灰色右箭头)打开【Menu任务】快捷菜单。在【选择数据源】下拉列表中选择【<新建数据源>】。在出现的【数据源配置向导】对话框中单击【站点地图】图标。如图7-7所示。
(5) 单击【确定】按钮关闭对话框。
(6) 当返回页面时，Menu控件现在显示了顶级元素【主页】(如图7-8所示)。这时，可以看到VWD 2008在【源】视图窗口中自动添加了SiteMapDataSource控件，同时给Menu控件添加了DataSourceID="SiteMapDataSource1"的属性值。生成的代码如下所示：

（点击查看大图）图7-7  【数据源配置向导】对话框

（点击查看大图）图7-8  添加了SiteMapDataSource控件后显示的结果

广州网站设计

1. <asp:Menu ID="Menu1" runat="server" DataSourceID="SiteMapDataSource1">
2.         </asp:Menu>
3.  <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />

(7) 再单击一次SiteMapDataSource，然后按F4键打开或激活【属性】窗口。将Show StartingNote属性的值由True改为False。注意，一旦这样做后，设计器中的Menu控件就会更新，并显示根元素下的所有直接子菜单。
(8) 再次单击Menu控件，然后用【属性】窗口对控件的属性作下列修改，如表7-5所示。
表7-5  Menu控件属性的设置

特    性	值
StaticEnableDefaultPopOutImage	False
Orientation	Horizontal
ItemSpacing(需要展开的StaticMenuItemStyle的子特性)	10px

(9) 按Ctrl+F5键，在浏览器中打开页面。当把鼠标放在【计算机类】主菜单时，会自动显示其下拉菜单，选择【硬件】命令，执行结果如图7-9所示。

（点击查看大图）图7-9  【例7-8】执行结果