How to set up a breadcrumb in an ASP.net page

My folder hierarchy for the pages are (They are all in the same folder):

Site.Master
Default.aspx
find_provider.aspx
provider.aspx

I have a Web.sitemap page set up:

<?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="Homepage">
        <siteMapNode url="~/find_provider.aspx" title="Provider" description="Search for provider">
            <siteMapNode url="~/provider.aspx" title="Profile" description="Shows each provider profile" />
        </siteMapNode>
    </siteMapNode>
</siteMap>

I am calling in my MasterPage:

<div id="navigation">
    <ul>
        <li><asp:HyperLink runat="server" ID="lnkHome" NavigateUrl="~/Default.aspx">Home</asp:HyperLink></li>

        <asp:Repeater runat="server" ID="menu" DataSourceID="SiteMapDataSource1">
            <ItemTemplate>
                <li>
                    <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl='<%# Eval("Url") %>'><%# Eval("Title") %></asp:HyperLink>
                </li>
            </ItemTemplate>
        </asp:Repeater>
    </ul>

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

So Default.aspx is my landing page. User can click on find_provider.aspx to search for a provider of their choice. For each provider search result, the user can click on PROFILE link to view information for each individual provider, which is the provider.aspx page.

So:

• If I am on the home page my breadcrumb should be: Home
• If I am on the find a provider page my breadcrumb should be: Home
Provider
• If I am on the profile page my breadcrumb should be: Home Provider
Profile

Instead, I see this on my page (no matter what page I am in):

Please help me modify the code so that breadcrumb is shown for each sitenode and subsitenode.

Sample of what I want to achieve:

HTML:

<div class="bcHolder brClear"> <!-- BC MAIN -->
    <div class="innerBreadCrumb"> <!-- INNER BC -->
        <ul id="breadcrumb">
            <li><a href="default.aspx" rel="nofollow noreferrer noopener" title="Home"><img src="theImages/homeIcon.gif" alt="Home" title="Home" class="home" /></a></li>
            <li id="bc_fp"><a href="find_provider.aspx" rel="nofollow noreferrer noopener" title="Find a Provider">Find a Provider</a></li>
            <!--<li>{ON THE CURRENT PAGE TEXT/URL</li>-->
        </ul>
    </div> <!-- INNER BC -->
</div> <!-- BC MAIN -->

Output:

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

In reference to your question here: How to use Bootstrap style of BreadCrumb with my ASP.NET menu?

The SiteMapPath acts as the <ul/> tag in the HTML rendering. So to use the method there, your structure would likely be something like this:

<div class="bcHolder brClear"> <!-- BC MAIN -->
    <div class="innerBreadCrumb"> <!-- INNER BC -->
        <asp:SiteMapPath ID="SiteMap1" 
        runat="server"
        PathSeparator=" / " 
        ParentLevelsDisplayed="1" 
        PathDirection="RootToCurrent"
        ShowToolTips="true">
        <CurrentNodeStyle CssClass="current-node"></CurrentNodeStyle>
        <NodeTemplate>
            <li><a href="default.aspx" title="Home"><img src="theImages/homeIcon.gif" alt="Home" title="Home" class="home" /></a></li>
            <li id="bc_fp"><a href="find_provider.aspx" title="Find a Provider">Find a Provider</a></li>
            <!--<li>{ON THE CURRENT PAGE TEXT/URL</li>-->
            </NodeTemplate>
        </asp:SiteMapPath>
    </div> <!-- INNER BC -->
</div> <!-- BC MAIN -->

And then add the javascript you need to resolve the hyperlink of CurrentNode.

Hope this helps.

Method 2

This currently works for me.. I have lots more code in my Page_Load but this is the important piece

in my current MasterPages Pre-Render Event I have a method called

 protected void Page_PreRender(object sender, EventArgs e)
 {
     SetNavigationLabel();
 }

Then I setup this inside of the Page_Load()

protected void Page_Load(object sender, EventArgs e)
{   
    var pageUrl = GetCurrentPageName();
}

private void SetNavigationLabel()
{
    RadMenu NavigationMenu = (RadMenu)this.FindControl("RadMenu1");
    foreach (RadMenuItem m in NavigationMenu.Items)
    {
        if (Request.Url.AbsoluteUri.ToLower() == Server.MapPath(Request.Url.AbsolutePath.ToLower()) || m.Selected)
        {
            string sPagePath = System.Web.HttpContext.Current.Request.Url.AbsolutePath;
            System.IO.FileInfo oFileInfo = new System.IO.FileInfo(sPagePath);
            string sPageName = "~/" + oFileInfo.Name;
            oFileInfo = null;
            var navName1 = NavigationMenu.FindItemByUrl(Request.RawUrl);
            var navName = navName1.Text;
            lblNavTitle.Text = navName;
            ((IDisposable)NavigationMenu).Dispose();
            break;
        }
    }
}

public string GetCurrentPageName()
{
     var sPath = System.Web.HttpContext.Current.Request.Url.AbsolutePath;
     FileInfo oInfo = new FileInfo(sPath);
     var sReturn = oInfo.Name;
     oInfo = null;
     return sReturn;
}

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0