I want to add glyphicons to my custom built menu that I built using an <asp:Repeater>
and a web.sitemap
file as a data source.
Here is what I've tried:
<ul class="nav navbar-nav">
<asp:Repeater runat="server" ID="rptMenu" DataSourceID="smdsMain">
<ItemTemplate>
<li>
<a runat="server" href='<%# Eval("url") %>'>
<span class='glyphicon glyphicon-<%# Eval("glyphicon") %>'></span>
<%# Eval("title") %>
</a>
</li>
</ItemTemplate>
</asp:Repeater>
</ul>
<asp:SiteMapDataSource ID="smdsMain" runat="server" ShowStartingNode="false" SiteMapProvider="XmlSiteMapProvider" />
And here's an example of a node in my web.sitemap
:
<siteMapNode url="~/Secure/Home/Default" title="Home" description="Home" glyphicon="home" />
Here is the error I get.
System.Web.HttpException: DataBinding: 'System.Web.SiteMapNode' does not contain a property with the name 'glyphicon'.
I everything else works fine without the glyphicon implementation.
I know it is possible to have a custom attribute in your sitemap nodes because someone implemented it in this Stack Overflow post.
So I must be doing something wrong in my customer implementation. What is the correct way to implement this?
After some research I found that you can access custom attributes in this way:
<%# Eval("[attributeName]") %>
Using that knowledge I have implemented into my code like this to get it working:
<ul class="nav navbar-nav">
<asp:Repeater runat="server" ID="rptMenu" DataSourceID="smdsMain">
<ItemTemplate>
<li>
<a runat="server" href='<%# Eval("url") %>'>
<span class='glyphicon glyphicon-<%# Eval("[glyphicon]") %>'></span>
<%# Eval("title") %>
</a>
</li>
</ItemTemplate>
</asp:Repeater>
</ul>
<asp:SiteMapDataSource ID="smdsMain" runat="server" ShowStartingNode="false" SiteMapProvider="XmlSiteMapProvider" />