第9章站点导航

第9章　站点导航

站点导航是用户浏览网站时，网站提供的指引标志，这些指引标志使得用户清楚地知道当前位于网站中的位置。站点导航对于大型的企业级网站特别重要。ASP.NET可以为网站的访问者呈现一种简单而灵活的导航结构以便用户能够容易地导航到该网站的不同部分。本章我们来给大家详细讲解站点导航的知识。

9.1　创建站点地图文件

知识点讲解：光盘\视频讲解\第9章\创建站点地图文件.wmv

站点地图是指网站的整体结构，通过站点地图，可以按层次结构描述站点的布局。开发人员在规划站点导航模型时，应该先规划整个网站的结构。该网站结构可能会根据需要添加更多的页面或者移除多余的页面。ASP.NET提供了相关的控件和模板，允许开发人员静态或者动态地创建网站的站点地图。站点地图文件是后缀名为.setemap的XML文件。

【示例9-1】下面演示站点地图文件的创建方式。

（1）创建一个网站，命名为“创建站点地图”。

（2）在解决方案资源管理器中网站名上单击右键，选择“添加新项”命令，在弹出的“添加新项”对话框中选择“站点地图”文件，命名为Web.sitemap。然后单击“添加”按钮，如图9.1所示。

图9.1　“添加新项”对话框

Visual Studio 2012为站点地图文件提供了部分代码，具体如下：

站点地图文件以<siteMap>作为根元素，在该元素中嵌套至少一个<siteMapNode>子元素。每一个<siteMapNode>元素包含的属性及其说明如下。

• title：关联节点标题。该文本将显示在页面上。
• description：与关联节点对应的描述性文本。
• url：指定节点指向的页面的链接。该属性必须唯一。
• key：当前节点的关键字。
• roles：允许查看该站点地图文件的角色的集合。
• Provider：定义处理其他站点地图文件的站点导航提供程序名称。
• siteMapFile：设置包含其他相关SiteMapNode元素的站点地图文件。

在<siteMapNode>元素中url节点不是必需的，可以不指定。每个<siteMapNode>元素能够包含任意数量的子节点。每个节点的url属性必须以“～/”字符序列开始（“～/”字符用于表示当前网站的根目录）。而且在一个站点地图文件中不能包含两个相同的url。

（3）例如一个网站的结构如图9.2所示，我们为该结构创建站点地图。

图9.2　示例网站结构

为该示例结构创建站点地图文件，具体代码如下所示：

在站点地图中不能创建具有相同url的两个节点。因为ASP.NET默认的站点地图提供者SiteMapProvider将所有的链接信息存储在一个集合中，使用唯一的url作为索引。所以，重复的信息会引发错误。

创建一个反映站点结构的站点地图只完成了ASP.NET站点导航系统的一部分。导航系统的另一部分是在ASP.NET网页中显示导航结构，这样用户就可以在站点内轻松地移动。通过使用ASP.NET站点导航控件，就可以轻松地在页面中建立导航信息。导航控件的优点在于：

• 提供可视化的操作界面，和面向对象的思想，简化开发人员的使用。开发人员没有必要再去为HTML、CSS和JavaScript大费脑筋，只需要设置控件属性就可以制作出专业的网站导航。
• 数据源的多样化，可以动态生成导航内容。开发人员除了可以在程序中把导航内容写“死”，还可以把导航内容放在XML、SiteMap文件中甚至可以放在数据库中。

下面我们来学习几种导航控件。

9.2　眉毛导航控件SiteMapPath

SiteMapPath控件被称为面包屑或眉毛导航控件，该控件可以使用站点地图中的数据显示一个导航路径。SiteMapPath控件可以显示一组文本或者图像超链接，以便在使用最少页面空间的同时轻松地定位当前在网站中的位置。

9.2.1　SiteMapPath控件简介

知识点讲解：光盘\视频讲解\第9章\SiteMapPath控件简介.wmv

SiteMapPath控件由多个节点组成，节点可分为三个类型：根节点、父节点和当前节点。SiteMapPath是一个非常简单但功能强大的控件，可以通过Properties面板来设置该控件的属性以影响它们的显示方式。SiteMapPath控件最常用的属性如表9.1所示。

表9.1　SiteMapPath控件的属性

下面对几个重要的属性进行详细说明：

（1）PathDirection属性

PathDirection属性用来获取或设置节点显示的方向。有两种显示方式：CurrentToRoot和RootToCurrent，默认值为RootToCurrent。当设置PathDirection属性值为RootToCurrent时，显示方式为从最顶部的节点到当前节点；当设置PathDirection属性值为CurrentToRoot时，显示方式为从当前节点到最顶部节点。

（2）SiteMapProvider属性

SiteMapProvider属性是SiteMapPath控件用来获取站点地图数据的数据源。如果未设置SiteMapProvider属性，SiteMapPath控件会使用SiteMap类的Provider属性获取当前站点地图的默认SiteMapProvider对象。其中，SiteMap类是站点导航结构在内存中的表示形式，导航结构由一个或多个站点地图组成。

除了属性之外，SiteMapPath控件还定义了一些事件。该控件常用的事件如表9.2所示。

表9.2　SiteMapPath控件的事件

注意：在SiteMapPath控件中，比较重要的事件就是ItemCreated和ItemDataBound。前者涉及创建节点过程，后者涉及数据绑定过程。

9.2.2　使用SiteMapPath控件

知识点讲解：光盘\视频讲解\第9章\使用SiteMapPath控件.wmv

使用SiteMapPath控件可以自动读取和呈现站点地图信息，无需代码和绑定数据。只有在站点地图中列出的页面才能在SiteMapPath控件中显示导航数据。如果将SiteMapPath控件放置在站点地图中未列出的页上，该控件将不会向客户端显示任何信息。

【示例9-2】下面演示SiteMapPath控件的使用方法。

（1）创建一个网站，命名为“使用SiteMapPath控件”。

（2）添加一个站点地图文件。在解决方案资源管理器中网站名上单击右键，选择“添加新项”命令，在弹出的“添加新项”对话框中选择“站点地图”文件，命名为Web.sitemap，单击“添加”按钮。Web.sitemap文件的代码如下：

（3）添加一个母版页，命名为MasterPage.master。一般建议将SiteMapPath控件放置在母版页中。MasterPage.master文件的代码如下：

（4）添加站点地图文件中各个文件夹和文件。让所有的Web页面都应用该母版页。解决方案资源管理器如图9.3所示。运行Food.aspx页面，结果如图9.4所示。

图9.3　解决方案资源管理器	图9.4　运行结果图

在该示例中，SiteMapPath控件会自动使用网站根目录下Web.sitemap文件中的数据，显示当前页面所在网站的层次结构。SiteMapPath控件是通过默认的站点地图提供者Web.sitemap文件中的数据实现的。

注意：该默认提供者派生自SiteMapProvider的XmlSiteMapProvider类。该类将基于文件后缀名为.sitemap的XML文件生成站点地图树。

9.2.3　使用SiteMap类

知识点讲解：光盘\视频讲解\第9章\使用SiteMap类.wmv

使用SiteMapPath控件，开发人员无需编写代码就可以在页面中添加站点导航。ASP.NET公开了一个反映站点地图结构的静态的SiteMap对象，该对象公开SiteMapNode对象的集合，用于表示站点中的每个节点。本小节我们学习SiteMap类的使用方法。

SiteMap对象中的所有成员均为静态成员。该对象具有两个与导航相关的属性，具体说明如下：

• CurrentNode属性：用于获取当前节点，返回SiteMapNode对象。
• RootNode属性：用于获取根节点，返回SiteMapNode对象。

【示例9-3】在示例9-2的基础上使用SiteMap类获取导航信息。

（1）创建一个网站，命名为“使用SiteMap类”。

（2）在母版页中对SiteMapPath控件做一些修改，变换分隔符的显示。MasterPage.master文件的具体代码如下：

（3）站点地图文件、文件夹都与示例9-2相同。以Products文件夹下的Food.aspx文件为例，演示SiteMap类的用法。在Food.aspx文件中添加三个标签控件、两个按钮控件。Food.aspx文件的代码具体如下：

（4）Food.aspx文件中的标签控件用来显示获取的当前节点的信息，按钮控件用来在相同级别的导航节点之间进行导航。在Food.aspx的后置代码中添加两个按钮的单击事件，并且在Page_Load事件中获取当前节点的信息，具体的代码如下：

运行结果如图9.5所示。

图9.5　运行结果图

在该示例中，判断了当前节点的同级上下节点是否为空。如果不为空，则调用Response.Redirect()方法导航到该URL，而且按钮的状态也会根据当前节点的两个Silbiling值发生变化。在Page_Load事件中，将当前节点信息在标签控件中显示出来。

注意：SiteMap对象中的所有成员均为静态成员。

9.3　树状导航控件TreeView

TreeView控件是除了SiteMapPath控件外的显示导航信息的方式。TreeView控件显示一个树状结构或者菜单，让用户可以遍历站点中的不同页面。一个经典的TreeView控件的应用就是Windows的资源管理器的左半部分。本节我们来学习树状导航控件TreeView的用法。

9.3.1　TreeView控件简介

知识点讲解：光盘\视频讲解\第9章\TreeView控件简介.wmv

本小节我们来学习TreeView控件的相关知识。TreeView控件主要支持的功能如下所示。

• 数据绑定：允许控件的节点绑定到XML、表格或关系数据。
• 站点导航：通过与SiteMapDataSource控件集成实现。
• 节点文本既可以显示为纯文本，也可以显示为超链接。
• 可通过编程方式访问TreeView对象模型，完成动态创建树、填充节点和设置属性等。
• 在每个节点旁显示复选框的功能。

TreeView控件是由一个或者多个节点组成。树中的每个项都被称为一个节点，由TreeNode对象表示。TreeView控件显示层次结构的数据，节点与节点之间有一定的层次关系。一个节点可以同时是父节点和子节点，但不能同时为根节点、父节点和子节点。TreeView控件的节点层次关系如图9.6所示。

图9.6　TreeView控件层次关系图

位于图9.6中最上层的是根节点，再下一层的是父节点，最底层的是子节点。子节点下面没有任何节点时称为叶节点。

注意：TreeView控件的每个节点都是一个TreeNode对象。每一个TreeNode节点都有一个相关的文本值，用于显示节点文本。

TreeNode对象还提供了大量的属性，这些属性具体如表9.3所示。

表9.3　TreeNode对象的属性

TreeView控件有很多常用的属性，用来控制它的格式化的显示功能。该控件常用的属性如表9.4所示。

表9.4　TreeView控件的属性

ExpandDepth属性是获取TreeView控件展开的节点数。默认值为将所有节点完全展开。SelectNode属性用于获取用户选中节点的TreeNode对象。当节点显示为超链接文本时，该属性返回值为null，不可用。

除了属性，TreeView控件还有一些常用的事件，这些事件的说明如表9.5所示。

表9.5　TreeView控件的事件

下面对比较重要的事件进行详细介绍。

（1）SelectedNodeChanged事件

TreeView服务器控件的TreeNode对象有选择模式和导航模式两种模式。默认情况下，节点文字处于选择模式。如果节点的NavigateUrl属性设置不为空，则该节点处于导航模式。

当TreeView控件处于选择模式时，用户单击节点将触发页面回发，并且触发服务器端的TreeView_SelectedNodeChanged事件。通过处理该事件可以获知当前的节点信息。

（2）TreeNodePopulate事件

在TreeNodePopulate事件下，可以用编程方式动态地填充TreeView控件的节点。当节点的PopulateOnDemand属性设置为true时，必须动态填充该节点。

9.3.2　使用TreeView控件

知识点讲解：光盘\视频讲解\第9章\使用TreeView控件.wmv

TreeView控件是ASP.NET中功能强大的控件，可以按照需要填入树状数据。该控件提供了大量的格式化特性，通过设置属性就可以改变控件的外观。

【示例9-4】下面演示TreeView控件的使用方法。

（1）创建一个网站，命名为“使用TreeView控件”。

（2）添加一个母版页文件，命名为MasterPage.master。在母版页中添加一个TreeView控件，该控件的菜单中提供了几个功能可以简化创建TreeView控件的过程。该任务菜单提供的功能如图9.7所示。

图9.7　TreeView控件提供的任务菜单

该任务菜单的具体说明如下。

• 自动套用格式：该选项可以让开发人员选择一种由Visual Studio 2012预定义的树状视图格式。“自动套用格式”对话框如图9.8所示。

图9.8　“自动套用格式”对话框

• 选择数据源：该下拉列表框可以让用户选择或者新建一个数据源控件。
• 编辑节点：选择该选项，会打开一个“TreeView节点编辑器”对话框。该对话框可以让用户在设计时为TreeView控件添加或编辑节点，如图9.9所示。在对话框的右侧“属性”面板中，可以为每个节点设置属性。
• 显示行：该复选框用于确定是否在每个节点的左侧显示导航线条。

图9.9　“TreeView节点编辑器”对话框

母版页文件MasterPage.master的具体代码如下所示：

（3）添加一个应用母版页的Web页面，命名为Default.aspx。运行结果如图9.10所示。

图9.10　运行结果图

从该示例中可以看到，TreeView控件由许多的TreeNode声明组成，每个TreeNode代表树状结构中的一个节点。每个节点又可以包含其他的节点，称为父节点。一个父节点可以有多个子节点。一个子节点只有一个父节点。如果一个节点不包含任何子节点，则称为叶节点。

注意：最顶层的节点是根节点。

9.3.3　动态添加节点

知识点讲解：光盘\视频讲解\第9章\动态添加节点.wmv

网站开发中，层次结构的数据很多时候需要修改，此时就需要使用代码动态地添加节点。TreeView控件提供的Nodes属性是TreeNodeCollection集合类型的属性。该属性用于存储一个或多个TreeNode对象的集合。除了Nodes属性外，每个TreeNode对象也具有一个ChildNodes属性，表示当前节点的子节点的集合。

注意：TreeNode对象用来添加节点，ChildNodes属性用来添加子节点。

【示例9-5】下面演示动态添加节点的方法。

（1）创建一个网站，命名为“动态添加节点”。

（2）在网站中添加一个Web页面，命名为Default.aspx。在Default.aspx页面中添加一个TreeView控件，代码如下：

然后在Default.aspx页面的代码后置文件中填写代码，具体如下所示：

运行结果如图9.11所示。

图9.11　运行结果图

在该示例中，TreeNode具有多重重载的构造函数。TreeView的Nodes属性是一个TreeNodeCollection类型的集合属性，可以调用该类型的Add()、Remove()和Count()等集合方法来操作TreeNode节点。

9.3.4　绑定XML文件

知识点讲解：光盘\视频讲解\第9章\绑定XML文件.wmv

TreeView控件用来显示层次化的数据，而XML数据文件本身也是一种层次化的数据。在ASP.NET中，将TreeView控件绑定到XML文件不需要开发人员手动编写代码，可以使用XmlDataSource控件来实现。

注意：XmlDataSource控件可以将具有层次结构的XML数据提供给TreeView控件进行显示。

【示例9-6】下面演示绑定XML文件的方法。

（1）创建一个网站，命名为“TreeView控件绑定到XML文件”。

（2）在解决方案资源管理器中创建一个XML文件，命名为XMLFile.xml。在XML文件中添加如下代码：

（3）在网站中添加一个Web页面，命名为Default.aspx。在该页面上添加一个TreeView控件和一个XmlDataSource控件（该控件在“工具箱”面板的“数据”栏中）。然后在设计视图中单击XmlDataSource控件右上角的智能标签。在弹出的任务菜单中选择“配置数据源”命令，打开“配置数据源”对话框，如图9.12所示。

图9.12　“配置数据源”对话框

“配置数据源”对话框有三个选项，具体说明如下。

• 数据文件：指定一个XML文件。该选项指定的值将作为XmlDataSource控件的DataFile属性值。该XML文件将作为XmlDataSource控件的数据来源。
• 转换文件：指定一个可扩展样式表语言XSL。将XML数据在显示之前进行样式转换。该属性的值将被赋给XmlDataSource控件的TransformFile属性。
• XPath表达式：指定筛选XML文件中的数据，使其返回一个查询子集的Xpath表达式。

（4）单击“数据文件”文本框右侧的“浏览”按钮，选择前面创建的XMLFile.xml文件，单击“确定”按钮。然后将TreeView控件的数据源指定为XmlDataSource控件，如图9.13所示。

图9.13　指定TreeView控件的数据源

此时，TreeView控件自动绑定到XML文件中。但是TreeView中的每个节点所绑定的值是XML文件中的元素标签，而不是元素的值。为了指定绑定的数据项，可以单击TreeView右上角的智能标签，在“TreeView任务”菜单中选择“编辑TreeNode数据绑定”命令。在“TreeView DataBindings编辑器”对话框中对可用的数据绑定进行设置，如图9.14所示。

图9.14　“TreeView DataBindings编辑器”对话框

“TreeView DataBindings编辑器”对话框中的“可用数据绑定”列表框列出了XML文件的节点信息。选择某个节点，单击“添加”按钮，将该节点添加到“所选数据绑定”列表框中。将XML节点添加到“所选数据绑定”列表框后，在“数据绑定属性”面板中自动将TreeNode的DataMember属性设置成所选的节点。在右侧的“数据绑定属性”面板中可以设置TreeNodeBinding的属性。

TreeNodeBinding提供了很多属性，可供进行绑定设置。一些属性提供了将TreeNode节点中的属性与XML文件进行直接绑定的特性，具体如下所示。

• ImageUrlField：要绑定到TreeNode对象的ImageUrl属性的字段。
• ImageToolTipField：要绑定到TreeNode对象的ImageToolTip属性的字段。
• NavigateUrlField：要绑定到TreeNode对象的NavigateUrl属性的字段。
• TextField：要绑定到TreeNode对象的Text属性的字段。
• ToolTipField：要绑定到TreeNode对象的ToolTip属性的字段。
• ValueField：要绑定到TreeNode对象的Value属性的字段。

在该示例中一些属性使用了静态属性，Default.aspx的代码如下所示：

运行结果如图9.15所示。

图9.15　运行结果图

在该示例中，所有的TreeNodeBinding对象都放在TreeView的DataBindings集合中。在运行时实例化TreeNodeBinding对象，并添加到DataBindings集合中。开发人员可以编程创建对XML的数据绑定。

9.3.5　带复选框的TreeView控件

知识点讲解：光盘\视频讲解\第9章\带复选框的TreeView控件.wmv

如果需要用户在TreeView中同时选择多个节点，则可以在TreeView控件中的每个节点旁边显示一个复选框。TreeView控件提供了一个名为ShowCheckBox的属性，该属性允许指定TreeNodeTypes枚举类型中的一个值。这样可以在TreeView控件中显示复选框，TreeNodeTypes枚举类型的可选值如下。

• TreeNodeType.All：为所有节点显示复选框。
• TreeNodeType.Leaf：为所有叶节点显示复选框。
• TreeNodeType.None：不显示复选框。
• TreeNodeType.Parent：为所有父节点显示复选框。
• TreeNodeType.Root：为所有根节点显示复选框。

这些选择使开发人员可以根据应用程序的需要，极灵活地为TreeView控件指定不同位置的复选框。

注意：如果需要，也可以为ShowCheckBox指定两个或多个枚举值。

【示例9-7】下面演示的是带复选框的TreeView控件。

（1）创建一个网站，命名为“带复选框的TreeView控件示例”。

（2）在该网站上添加一个Web页面，名称为Default.aspx。在该页面上添加一个TreeView控件、一个Button控件和一个Label控件。Default.aspx文件的代码如下：

在Default.aspx页面中，为TreeView控件的ShowCheckBoxes属性指定的值为All，这样所有的节点前面都会显示一个复选框。Button控件的单击事件用来获取用户选中的节点，将选中的节点显示在Label控件中。可以使用TreeView控件的CheckedNodes来循环遍历所选的节点。Default.aspx页面的代码后置文件内容如下：

运行结果如图9.16和图9.17所示。

图9.16　运行结果图（1）	图9.17　运行结果图（2）

在该示例中，首先使用CheckedNodes集合的Count属性判断用户是否选中了复选框，然后遍历CheckedNodes集合中用户所选中的节点，最后将选中的节点的值显示在Label控件上。

9.4　菜单控件Menu

Menu控件是ASP.NET中另一个功能强大的导航控件。该控件可以在页面上显示一个可展开的菜单，让每个用户遍历网站中的不同页面。本节我们来学习菜单控件Menu的相关内容。

9.4.1　Menu控件简介

知识点讲解：光盘\视频讲解\第9章\Menu控件简介.wmv

本小节我们来学习Menu控件的相关知识。Menu控件支持的功能如下所示。

• 数据绑定：将控件菜单项绑定到分层数据源。
• 站点导航：通过与SiteMapDataSource控件集成实现。
• 对Menu对象模型的编程访问，可动态创建菜单、填充菜单项和设置属性等。
• 可自定义外观，通过主题、用户定义图像、样式和用户定义模板实现。

利用ASP.NET的Menu控件，可以开发ASP.NET网页的静态和动态显示菜单。静态显示即Menu控件始终是完全展开的，可以通过设置StaticDisplayLevels属性设置菜单静态显示的层次。在动态显示的菜单中，只有指定的部分是静态的。当用户将鼠标指针放置在父节点上时才会显示其子菜单项。动态显示可以通过MaximumDynamicDisplayLevels属性设置。

Menu控件由一个或多个MenuItem对象组成。每一个MenuItem作为菜单的一个选项，每个MenuItem对象又包含一个ChildItems的子集合。Menu控件定义了一些常用的属性和事件。该控件常用属性如表9.6所示。

表9.6　Menu控件的属性

下面对比较重要的属性进行详细介绍。

（1）DisappearAfter属性

该属性用来获取或设置当鼠标离开Menu控件后菜单的延迟显示时间，默认值为500毫秒。默认情况下，鼠标离开Menu控件后，菜单在一定时间内自动消失。

注意：如果希望菜单立刻消失，可单击Menu控件以外的空白区域。

（2）Orientation属性

Orientation属性指定Menu控件的呈现方向。如果Orientation属性的值为Horizontal，则水平显示Menu控件；如果Orientation属性的值为Vertical，则垂直显示Menu控件。

除了属性，Menu控件还定义了一些常用的事件。这些事件及其说明如表9.7所示。

表9.7　Menu控件的事件

9.4.2　使用Menu控件

知识点讲解：光盘\视频讲解\第9章\使用Menu控件.wmv

Menu控件的使用方法同TreeView控件相似。从工具箱的“导航”栏中拖一个Menu控件到Web页面上，即可对Menu控件进行各种操作。

【示例9-8】下面演示Menu控件的使用方法。

（1）创建一个网站，命名为“Menu菜单控件”。

（2）在该网站中添加一个Web页面，命名为Default.aspx。从工具箱的“导航”栏中拖一个Menu控件到Default.aspx页面上。该任务菜单提供的功能如图9.18所示。

图9.18　Menu控件提供的任务菜单

Visual Studio 2012提供了可视化的方式设置菜单项。要声明性地添加MenuItem项，可以使用Menu控件的任务菜单中的“编辑菜单项”命令。“菜单项编辑器”对话框如图9.19所示。

图9.19　“菜单项编辑器”对话框

“菜单项编辑器”对话框的工具栏提供了很多辅助添加菜单的选项。“属性”面板中列出了每一个MenuItem可供设置的属性，常用的属性如下。

• Text：显示在菜单项中的文本信息。
• ToolTip：当鼠标移过菜单项时显示的提示信息。
• Value：存储每个菜单项附带的并不显示的信息。
• NavigateUrl：设置该属性后，单击节点时会自动链接到指定的URL。
• Target：设置NavigateUrl属性后，该属性用于指定目标窗口。
• Selectable：设置某菜单项是否可以选择。可以将不希望用户选择的项的该属性设置为false。
• ImageUrl：指定菜单项旁边显示图片的路径。
• SeparatorImageUrl：显示在菜单项底部，将菜单项与其他菜单项隔开的分割图片路径。

还可以使用Menu控件任务菜单中提供的格式来设置菜单的外观。在Menu任务菜单中选择“自动套用格式”命令，在打开的“自动套用格式”对话框中选择“传统型”格式，如图9.20所示。Visual Studio 2012会自动添加一些预置的格式代码。图9.19中添加了一个类似于记事本菜单的菜单项。单击“确定”按钮后，Visual Studio 2012将会自动生成如下的菜单项声明代码：

图9.20 “自动套用格式”对话框

在默认情况下，菜单以竖向进行显示。在Default.aspx页面中，可以设置Menu控件的Orientation属性的值为Horizontal，即菜单水平显示。运行结果如图9.21所示。

图9.21　运行结果图

在该示例中，套用了“传统型”格式，而且将Menu控件的Orientation属性设置为Horizontal，使得菜单项横向显示。

注意：可以给Menu控件套用各种格式，使其更加美观。

9.4.3　动态添加菜单项

知识点讲解：光盘\视频讲解\第9章\动态添加菜单项.wmv

每个菜单项作为Menu对象Items集合中的一个成员，很容易动态添加菜单项。本节我们来学习动态添加菜单项的方法。

【示例9-9】下面演示动态添加菜单项的方法。

（1）创建一个网站，命名为“动态添加菜单项”。

（2）在该网站上添加一个Web页面，命名为Default.aspx。在该页面上添加一个Menu控件，为该控件套用“传统型”格式。Default.aspx页面代码如下：

然后在Default.aspx页面的代码后置文件中填写代码，具体如下所示：

运行结果如图9.22所示。

图9.22　运行结果图

在该示例中，Menu控件套用的是“传统型”格式。

注意：Orientation属性不进行设置时，默认的是竖向显示。

9.4.4　绑定XML文件

知识点讲解：光盘\视频讲解\第9章\绑定XML文件.wmv

Menu控件也可以绑定到XML文件，绑定方式与TreeView控件类似。将Menu控件绑定到XML文件不需要开发人员手动编写代码，可以使用XmlDataSource控件。XmlDataSource控件将具有层次结构的XML数据提供给Menu控件进行显示。

【示例9-10】下面演示将Menu控件绑定到XML文件的方法。

（1）创建一个网站，命名为“Menu控件绑定到XML文件”。

（2）在该网站上添加一个XML文件，命名为XMLFile.xml。在XMLFile.xml文件中添加如下代码：

（3）在网站中添加一个Web页面，命名为Default.aspx。在该页面上添加一个Menu控件和一个XmlDataSource控件（该控件在“工具箱”面板的“数据”栏中）。然后在设计视图中单击XmlDataSource控件右上角的智能标签。在弹出的任务菜单中选择“配置数据源”命令，打开“配置数据源”对话框，如图9.23所示。

图9.23　“配置数据源”对话框

单击“数据文件”文本框右侧的“浏览”按钮，选择前面创建的XMLFile.xml文件，单击“确定”按钮。然后将Menu控件的数据源指定为XmlDataSource控件，如图9.24所示。

图9.24　指定Menu控件的数据源

此时，Menu控件自动绑定到XML文件中。但是Menu中的每个节点所绑定的值是XML文件中的元素标签，而不是元素的值。为了指定绑定的数据项，可以单击Menu右上角的智能标签，在“Menu任务”菜单中选择“编辑MenuItem Databindings”命令，在“菜单DataBindings编辑器”对话框中对可用的数据绑定进行设置，如图9.25所示。

图9.25　“菜单DataBindings编辑器”对话框

最后，给Menu控件套用“传统型”格式。综上所述，Default.aspx的代码如下所示：

运行结果如图9.26所示。

图9.26　运行结果图

在该示例中，将Menu控件绑定到XML文件，绑定方式与TreeView控件类似。将Menu控件套用“传统型”格式。未设置Menu控件的Orientation属性，默认采用竖向显示菜单。

注意：Orientation属性不进行设置时，默认的是竖向显示。

9.5　地址映射

ASP.NET提供了地址映射的功能。有些情况下，开发人员希望隐藏网站的真实地址，特别是一些保密性强的网站。而有一些情况是开发人员希望提供特别的地址，可以让用户记住所访问的网站，以便下次访问。

9.5.1　相对地址和绝对地址

知识点讲解：光盘\视频讲解\第9章\相对地址和绝对地址.wmv

在网站的开发中，使用URL（统一资源定位符）来唯一地标识网站资源。这些URL用在网站的各个地方。URL分为相对地址和绝对地址。

1. 相对地址

相对地址就是被链接文件相对于当前页面的地址。比如我们要链接当前目录下Images目录下的Logo.jpg文件，那相对地址就是Images/Logo.jpg。如果当前文件或者是Images目录下的Logo.jpg文件移动位置，这个地址就找不到了。

2. 绝对地址

绝对地址就是文件在网络或者本地的绝对位置。绝对地址总是指向固定的位置，有助于确保总是引用完全相同的资源，而不管该资源文档位于何处。

注意：在开发过程中，请慎用绝对地址。当引用Web站点之外的资源时总是需要它们，不过在可能的情况下应该首先选择自己项目中的相对地址。

9.5.2　URL地址映射

知识点讲解：光盘\视频讲解\第9章\URL地址映射.wmv

ASP.NET的地址映射是指对指定的URL请求跳转到另外一个URL。URL地址映射可以通过在Web.config配置文件中使用<urlMappings>块来配置。下面的代码是一个简单的URL地址映射：

在<urlMappings>配置中，url是请求URL，是一个简单易记的地址，不是真实地址。而mappedUrl是目标URL，是原始的地址。当用户请求页面时，ASP.NET会根据Web.config配置文件中的设置进行地址匹配。一旦发现匹配的地址，将会使用与Server.Transfer()类似的方法进行页面重定向。

注意：在这个过程中，不会产生任何网络负载，而且客户端浏览器的地址也不会发生变化，仍显示被映射的地址。

9.6　小结

本章主要介绍了ASP.NET的站点导航，包括创建站点地图文件、眉毛导航控件SiteMapPath、树状导航控件TreeView、菜单控件Menu和地址映射。重点是对导航控件的掌握，有兴趣的读者可以自己尝试着运用这些导航控件为自己的网站添彩加色。

9.7　本章习题

习题9-1　在Visual Studio 2012中新建一个网站，命名为chapter9_1。在该网站上添加一个站点地图文件，命名为Web.sitemap。在该网站上添加三个Web页面，分别命名为Default.aspx、Default2.aspx、Default3.aspx。该站点地图结构如图9.27所示。

图9.27　结构图

【分析】本题目主要考查的是对创建站点地图文件的掌握情况。

【关键代码】Web.sitemap文件代码如下：

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
    <siteMapNode url="~/Default.aspx" title="首页"  description="欢迎光临网站首页">
        <siteMapNode url="~/Default2.aspx" title="客服"  description="客服帮您解决问题" />
        <siteMapNode url="~/Default3.aspx" title="投诉"  description="有问题请投诉" />
    </siteMapNode>
</siteMap>

习题9-2　在Visual Studio 2012中新建一个网站，命名为chapter9_2。在该网站上添加一个站点地图文件，命名为Web.sitemap。在网站上添加一个母版页，命名为MasterPage.master。在母版页中添加一个SiteMapPath导航控件。在该网站上添加三个基于母版页的Web页面，分别命名为Default.aspx、Default2.aspx、Default3.aspx。分别运行三个Web页面，结果如图9.28～图9.30所示。

图9.28　运行结果图（1）	图9.29　运行结果图（2）	图9.30　运行结果图（3）

【分析】本题目主要考查的是对SiteMapPath控件的掌握情况。

注意：建议将SiteMapPath控件放在母版页文件中，该示例的站点地图文件即习题9-1中的Web.sitemap文件。

习题9-3　在Visual Studio 2012中新建一个网站，命名为chapter9_3。在该网站上添加一个站点地图文件，命名为Web.sitemap。在网站上添加一个母版页，命名为MasterPage.master。在母版页中添加一个TreeView导航控件和一个SiteMapDataSource控件。在该网站上添加一个基于母版页的Web页面，命名为Default.aspx。运行结果如图9.31所示。

图9.31　运行结果图

【分析】本题目主要考查的是对使用TreeView控件的掌握情况。

注意：建议将TreeView控件和SiteMapDataSource控件放在母版页文件中，该示例的站点地图文件即习题9-1中的Web.sitemap文件。

习题9-4　在Visual Studio 2012中新建一个网站，命名为chapter9_4。在该网站上添加一个站点地图文件，命名为Web.sitemap。在该网站上添加一个Web页面，命名为Default.aspx。在该Web页面上添加一个Menu控件和一个SiteMapDataSource控件。运行结果如图9.32所示。

图9.32　运行结果图

【分析】本题目主要考查的是对Menu控件的掌握情况。

注意：将TreeView控件和SiteMapDataSource控件放在Web页面中，该示例的站点地图文件即习题9-1中的Web.sitemap文件。

习题9-5　在Visual Studio 2012中新建一个网站，命名为chapter9_5。在该网站上添加一个Web页面，命名为Default.aspx。在该Web页面上添加一个Menu控件，并为其套用格式“简明型”。在代码后置文件中为Menu控件动态添加菜单项，运行结果如图9.33所示。

图9.33　运行结果图

【分析】本题目主要考查的是对动态添加菜单项的掌握情况。

【关键代码】Default.aspx.cs文件代码如下：

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        MenuItem menuitem = new MenuItem();
        menuitem.Text = "首页";
        menuitem.ToolTip = "欢迎光临网站首页";
        Menu1.Items.Add(menuitem);
        MenuItem men = new MenuItem("客服");
        men.ToolTip = "客服帮您解决问题";
        Menu1.Items.Add(men);
        MenuItem item = new MenuItem("投诉");
        item.ToolTip = "有问题请投诉";
        Menu1.Items.Add(item );
    }
}