Joe Levi:
a cross-discipline, multi-dimensional problem solver who thinks outside the box – but within reality™

Better Control over the ASP.NET Sitemap UI

I’m a fan of using ASP.NET’s web.sitemap feature, but I’m less impressed with the level of control that you have (rather, you DON’T have) over the menu controls that consume the web.sitemap datasource (http://www.BuyLifetime.com uses three menu controls that consume the same sitemap from MS Commerce Server 2007, which look 90% like what we want them to).

Wouldn’t it be nice if you could just make it into a navigation list? We all know (or should know by now) that a navigation list (whether ordered or unordered) should be just that, a hierarchical (“nested”) list of pages in your site.

To do this we can use a Repeater control and use the web.sitemap datasource as the contents.

It’s easy enough to make a one-level-deep list, and not too much more difficult to do a two-level-deep list.

   1: <asp:Repeater visible="false" runat="server" ID="siteMapAsBulletedList" DataSourceID="SiteMapDataSource1">
   2:     <HeaderTemplate><ul></HeaderTemplate>
   3:     <ItemTemplate>
   4:         <li>
   5:             <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl='<%# Eval("Url") %>' Text='<%# Eval("Title") %>' />
   6:             <asp:Repeater runat="server" id="SecondLevel" DataSource='<%# ((SiteMapNode) Container.DataItem).ChildNodes %>'>
   7:                 <HeaderTemplate><ul></HeaderTemplate>
   8:                 <ItemTemplate>
   9:                     <li><asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl='<%# Eval("Url") %>' Text='<%# Eval("Title") %>'></asp:HyperLink></li>
  10:                 </ItemTemplate>
  11:                 <FooterTemplate></ul></FooterTemplate>
  12:             </asp:Repeater>    
  13:         </li>
  14:     </ItemTemplate>
  15:     <FooterTemplate></ul></FooterTemplate>
  16: </asp:Repeater>

Share

You may also like...

1 Response

  1. matthew says:

    Another suggestion is to use CSS Friendly Adapters and a TreeView. It renders a nice, if css-class verbose, unordered list.

Leave a Reply