This is a migrated thread and some comments may be shown as answers.

Highlighting Currently Selected Item

12 Answers 279 Views
Menu
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Jarrod
Top achievements
Rank 1
Jarrod asked on 13 Nov 2009, 02:54 AM
Hi all,

I am just implementing the Menu extension and have seen the selectedindex. However one feature of the RadMenu was that it would automatically added a "selected" css class to the top menu item which represented the current page. Is there a way to get the similar functionality in the MVC Menu extension?

12 Answers, 1 is accepted

Sort by
0
Georgi Krustev
Telerik team
answered on 13 Nov 2009, 09:48 AM
Hello Jarrod,

The current available download of Telerik Extensions for ASP.NET MVC does not have Menu's SelectedIndex functionality implemented. For your convenience I have attached a build, which have the required functionality.

Regards,
Georgi Krustev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Jarrod
Top achievements
Rank 1
answered on 15 Nov 2009, 06:08 AM
hey Georgi thanks for that. I thought however in the RadMenu it would automatically detect which top menu item to mark as selected. I didn't think we had to tell the menu which one to select. Although I could be wrong.

If I am wrong than I assume the best way of using this functionality is to pass the currentnode index to the view in the viewdata to set the selectedindex?
0
Georgi Krustev
Telerik team
answered on 16 Nov 2009, 10:35 AM
Hello Jarrod,

After you last message I suppose you need to highlight the current selected item depending on the route. If you use this functionality, enable highlightpath using HighlightPath(true). Review this online help article(it is for the panelbar, but covers the menu too) and this online demo (menu/serverbinding is selected).

Sincerely yours,
Georgi Krustev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Jarrod
Top achievements
Rank 1
answered on 16 Nov 2009, 11:13 PM
 Georgi we are so close!

Okay I have got the highlightpath to work. It is actually enabled by default but while look at the demo you link to I noticed I had my sitemap in the old standard link format as opposed to controller and action. Changing my sitemap to instead have controllers and actions started to make the highlightpath work. However this highlights not the one I want. For example in the demo...it highlights "SiteMap Binding" however I want it to highlight the parent "Menu". SelectedIndex does do this manually but I was hoping it was automatic.

Thanks for your help.
0
Georgi Krustev
Telerik team
answered on 17 Nov 2009, 01:16 PM
Hi Jarrod,

We review your request and decide to highlight entire path to the selected item. Please review the attached test project.

Kind regards,
Georgi Krustev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Shane Milton
Top achievements
Rank 2
answered on 12 May 2010, 12:00 AM
I see this working in the attached project (highlighting parent nodes in addition to the selected node), but I don't see what is causing this to work. Is this no longer functional or am I missing how this feature is activated? I'm binding to a SiteMap with HighlightPath set to true.

                <% Html.Telerik().Menu() 
                       .Name("SiteNav") 
                       .BindTo("EMSite") 
                       .Theme("simple") 
                       .HighlightPath(true) 
                       .Effects(fx => fx.Slide().OpenDuration(100).CloseDuration(350)) 
                       .HtmlAttributes(new { style = "position: relative; z-index: 100" }) 
                       .Render(); %> 
 

Thanks!
0
Atanas Korchev
Telerik team
answered on 12 May 2010, 06:36 AM
Hello Shane Milton,

This feature still works as can be seen in our online demo. The only thing required is the menu to be sitemap bound. If you are having problems enabling this feature I suggest you open a support ticket and send us some code.

Regards,
Atanas Korchev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Shane Milton
Top achievements
Rank 2
answered on 12 May 2010, 06:39 AM
Hi Atanas,

I think I might be requesting a feature slightly different than this. I do not see the behavior in that demo that I'm looking for. What I'd like to see is not just the "SiteMap Binding" node selected, but also it's parent "Menu" node selected as well. In other words, I'd like a breadcrumb through my menu all the way to my selected node.

Does that make sense?

Thanks,
-Shane
0
Atanas Korchev
Telerik team
answered on 12 May 2010, 09:25 AM
Hi Shane Milton,

This can be achieved with CSS (for the vista skin):

.t-menu .t-highlighted
{
        background-color: #e3f4fc;
        border-color: #a7bac5;
}

The menu applies .t-highlighted to the parent items of the current one (which has .t-state-selected) applied.

Regards,
Atanas Korchev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Shane Milton
Top achievements
Rank 2
answered on 12 May 2010, 09:28 AM
Ahhh, that's exactly what I'm looking for. Many thanks!! :-)
0
Karson
Top achievements
Rank 1
answered on 02 Dec 2010, 06:05 PM

You must bind to a sitemap but additionally the SiteMapNode must have the controller and action attributes set for your MVC pages.  Specifying the URL attribute alone is not sufficient.



<
siteMapNode url="CurrentUser.aspx" title="Current User" controller="CurrentUser" action="Index" />


FYI
I include the URL attribute (prior to this I used it exclusively) because the sitemap is being shared between the Telerik Menu control and an asp:Menu control in my split (WebForm/MVC) environment.

0
Adrian Zhao
Top achievements
Rank 1
answered on 05 Apr 2013, 02:05 PM
Hi Atanas:

Your solution below works great if the top level menu is selected.  
.t-menu .t-highlighted
{
        background-color: #e3f4fc;
        border-color: #a7bac5;
}

However It doesn't work when a submenu is selected.  Do you have any ideas how to make it work for submenu items.

Thanks,
Adrian
Tags
Menu
Asked by
Jarrod
Top achievements
Rank 1
Answers by
Georgi Krustev
Telerik team
Jarrod
Top achievements
Rank 1
Shane Milton
Top achievements
Rank 2
Atanas Korchev
Telerik team
Karson
Top achievements
Rank 1
Adrian Zhao
Top achievements
Rank 1
Share this question
or