【ASP.NETStepbyStep】之三MasterPagesandSiteNavigation

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› ASP.NET›ASP.NET编程经验

原作者: [db:作者] 来自: [db:来源] 收藏邀请

1. 模版页，添加一个Master Page，使整个站点有统一的显示风格。
    主页面：
    <div id="content">
              <asp:contentplaceholder id="MainContent" runat="server">
              
               </asp:contentplaceholder>
  </div>

    新建的页面：
    Default.aspx

2. 站点地图，是一个XML文件，每次添加删除了页面，要更改这个文件
可以用下面这些标记将站点地图绑定到Menu控件中：

1<div id="navigation">
2    <asp:Menu ID="Menu1" runat="server"
3      DataSourceID="SiteMapDataSource1">
4    </asp:Menu>
5
6    <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
7</div>

3. Reapter控件的使用，当将SiteMapDataSource绑定到Repeater时，会自动遍历。
因为SiteMapDataSource控件的ShowStartingNode属性被设为false，所以从站点地图的第二级节点开始。
使用嵌套，第一层绑定站点第二级，第二层绑定站点第三极：

1<asp:Repeater runat="server" ID="menu" DataSourceID="SiteMapDataSource1">
2    <ItemTemplate>
3        <li>
4            <asp:HyperLink runat="server"
5            NavigateUrl="<%# Eval("Url") %>">
6>

这两个Repeater生成的HTML标记（为了节省篇幅一些标记被移除了）：

1<li>
2    <a href="/Code/BasicReporting/Default.aspx">Basic Reporting</a>
3    <ul>
4       <li>
5          <a href="/Code/BasicReporting/SimpleDisplay.aspx">
6            Simple Display</a>
7       </li>
8       <li>
9          <a href="/Code/BasicReporting/DeclarativeParams.aspx">
10            Declarative Parameters</a>
11       </li>
12       <li>
13          <a href="/Code/BasicReporting/ProgrammaticParams.aspx">
14            Setting Parameter Values</a>
15       </li>
16    </ul>
17</li>
18
19<li>
20    <a href="/Code/Filtering/Default.aspx">Filtering Reports</a>
21
22</li>
23
24<li>
25    <a href="/Code/CustomFormatting/Default.aspx">
26      Customized Formatting</a>
27
28</li>

4. 因为我们使用了这样的CSS

#navigation {
width: 200px;
top: 5em;
left: 1em;
width: 13em;
position:absolute;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:90%;
}
#navigation ul {
list-style: none;
margin: 0;
padding: 0;
}
#navigation li {
border-bottom: 1px solid #ED9F9F;
}
#navigation li a {
display: block;
padding: 5px 5px 5px 0.5em;
border-left: 12px solid #711515;
border-right: 1px solid #711515;
background-color: #B51032;
color: #FFFFFF;
text-decoration: none;
}
#navigation li a:hover {
background-color: #711515;
color: #FFFFFF;
}
#navigation ul ul {
margin-left: 12px;
}
#navigation ul ul li {
border-bottom: 1px solid #711515;
margin:0;
background-color: #ED9F9F;
color: #711515;
}
#navigation ul ul a:link, #navigation ul ul a:visited {
background-color: #ED9F9F;
color: #711515;
}
#navigation ul ul a:hover {
background-color: #711515;
color: #FFFFFF;
}
显示结果是这样的：

5. 添加breadcrumb导航
breadcrumb导航在asp.net 2.0中是简单的－只要添加一个SiteMapPath控件到页面上就可以了；不需要更多的代码。

1<span class="breadcrumb">
2 <asp:SiteMapPath ID="SiteMapPath1" runat="server">
3 </asp:SiteMapPath>
4</span>

6. ViewState   当你点击返回上一级时，你在上一个页面填写的内容会不会还在。
    最终生成HTML时ViewState被系列化并保存在一个隐藏的表单域中。控件用ViewState来记忆它们在页面返回时被程序改变的状态，比如Web控件绑定的数据。如果视图状态允许信息可以在页面返回时保持，它会增大发送到客户端HTML代码的尺寸。
    可以将EnableViewState属性设为false在页面级或者控件级关闭视图状态。

7. Web User Control