I'm using sitemap navigation for the menu.The page navigation is working fine for me but the parent menu is not highlighting on selecting sub menu items. The code I have written is mentioned below-
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="false" />
<asp:Menu ID="Menu" runat="server" DataSourceID="SiteMapDataSource1" Orientation="Horizontal"
OnMenuItemDataBound="OnMenuItemDataBound">
<StaticMenuStyle BorderStyle="None" />
<staticselectedstyle backcolor="Green" borderstyle="Solid" bordercolor="Black" borderwidth="1"/>
<StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" BorderStyle="Solid"
BorderColor="White" BorderWidth="1px" />
<DynamicHoverStyle BackColor="#5E2433" ForeColor="White" />
<DynamicMenuStyle BorderColor="#666666" Width="155px" BackColor="#EFEDED" />
<DynamicSelectedStyle BackColor="#5D7B9D" />
<DynamicMenuItemStyle Width="155px" BorderColor="White" BorderStyle="Solid" BorderWidth="1px"
HorizontalPadding="5px" VerticalPadding="2px" />
<StaticHoverStyle BackColor="#5E2433" ForeColor="White" />
</asp:Menu>
In the master.cs page code is-
protected void OnMenuItemDataBound(object sender, MenuEventArgs e)
{
if (SiteMap.CurrentNode != null)
{
if (e.Item.Text == SiteMap.CurrentNode.Title)
{
if (e.Item.Parent != null)
{
e.Item.Parent.Selected = true;
}
else
{
e.Item.Selected = true;
}
}
}
}
The sitemap is like -
<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode url="" title="" description="">
<siteMapNode url="" title="EMPLOYEES" description="Employees Page">
<siteMapNode url ="" title="New Employee" description=""></siteMapNode>
<siteMapNode url ="" title="Edit Details" description=""></siteMapNode>
<siteMapNode url ="" title="Calender" description=""></siteMapNode>
<siteMapNode url ="employees/Benefits.aspx" title="Benefits" description="">
<siteMapNode url ="employees/Vehicle.aspx" title="Vehicle" description=""></siteMapNode>
<siteMapNode url ="employees/Loan.aspx" title="Loan" description=""></siteMapNode>
<siteMapNode url ="" title="Accomodation" description=""></siteMapNode>
<siteMapNode url ="" title="Medical Insuarance" description="">
<siteMapNode url ="" title="Annual" description=""></siteMapNode>
<siteMapNode url ="" title="One-Off" description=""></siteMapNode>
</siteMapNode>
</siteMapNode>
</siteMap>
I have tried but not able to highlight the parent menu on selecting a sub menu item. Any help will be highly appreciated.
Your code is correct. Apparently the code only assign 'selected' class to the select menu item. You have to write your own css to style the selected item. Other than that, the code is correct.
#Menu1 ul li a.selected{
border:1px solid blue;
background-color:blue !important;
color:white;
}
Your code actually helped me solve my 'selection' problem :)