<< Creating a Simple Context Menu | Home | Problems With Windows Live Writer (Beta) >>

TreeView With SiteMapDataSource

You can easily populate a TreeView control by using a SiteMapDataSource control. This is extremely useful if you are using your TreeView control as a main navigation menu. All you need to do is to create a Web.sitemap file which will contain all the navigation of the website and use then use the SiteMapDataSource control to populate the TreeView control.

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="Home" description="">

 

<siteMapNode url="~/Books/Default.aspx" title="Books" description="">

<siteMapNode url="~/Books/Fiction/FictionBooks.aspx" title="Fiction" />

<siteMapNode url="~/Books/Horror/HorrorBooks.aspx" title="Horror" />

</siteMapNode>

<siteMapNode url="~/Movies/Default.aspx" title="Movies" >

<siteMapNode url="~/Movies/Comedy/ComedyMovies.aspx" title="Comedy Movies" />

<siteMapNode url="~/Movies/Horror/HorrorMovies.aspx" title="Horror Movies" />

</siteMapNode>

</siteMapNode>

</siteMap>

And now the master page code that contains the TreeView control:

 

<asp:contentplaceholder id="ContentPlaceHolder1" runat="server">

<asp:SiteMapPath ID="SiteMapPath1" runat="server">

<RootNodeTemplate>

<asp:HyperLink ID="hlRoot" runat="server" Text='<%# Eval("title") %>' NavigateUrl='<%# Eval("url") %>' />

</RootNodeTemplate>

<CurrentNodeTemplate>

<asp:HyperLink ID="hlCurrentNodeTemplate" runat="server" Text='<%# Eval("title") %>' NavigateUrl='<%# Eval("url") %>' />

</CurrentNodeTemplate>

</asp:SiteMapPath>

<br />

<asp:TreeView ID="tvMenu" DataSourceID="SiteMapDataSource1" runat="server" BackColor="PeachPuff" BorderColor="#C0C000" ImageSet="Arrows">

<ParentNodeStyle Font-Bold="False" />

<HoverNodeStyle Font-Underline="True" ForeColor="#5555DD" />

<SelectedNodeStyle Font-Underline="True" ForeColor="#5555DD" HorizontalPadding="0px"

VerticalPadding="0px" />

<NodeStyle Font-Names="Tahoma" Font-Size="10pt" ForeColor="Black" HorizontalPadding="5px"

NodeSpacing="0px" VerticalPadding="0px" />

</asp:TreeView>

<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />

</asp:contentplaceholder>

Print | posted @ Tuesday, August 22, 2006 7:55 PM

Twitter