2

I have Kendo menu with actions:

@(Html.Kendo().Menu().Name("menu")
.Items(it => {                                       
       it.Add().Text("Item1").Items(subit => {
                subit.Add().Text("subitem1).Action("Contracts", "Home");
                subit.Add().Text("subitem2").Action("Contracts", "Home",
                                                       new { flag = true });
 });
 })
)

My problem is that whenever I select subitem1 or subitem2 the items get both selected (class .k-state-selected added to both items). I guess that it happens because I have the same controller actions. I wouldn't like to create separate action for subitem2. Is there any workaround?

Thanks a lot!

Gyuzal
  • 1,581
  • 10
  • 52
  • 99
  • Just for some context, what is the reason for having 2 links navigating to the same page like you have in the example? –  Apr 17 '15 at 13:02
  • That's actually what Kendo does: it checks the current URL and sets the `k-state-selected` class on items pointing to it. – Andrei V Apr 17 '15 at 13:05
  • @gerdi, they return views with different data based on the route values. – Gyuzal Apr 17 '15 at 13:14

1 Answers1

0

I am not not if this works because i do not have the kendo library and i cant seem to test it properly at http://dojo.telerik.com/ but basically

Fires before a sub menu gets opened.

$("#menu").kendoMenu({
     open: function(e) {
           if (location.search != "") {
               $('#menu #item a:first').removeClass('.k-state-selected');
        }
     }
 });

It then looks to see if the url has properties, as per the location.search and if it does then it removes the kendo class from the menu first menu item, which is not the one passing anything.

I am not sure how kendo builds its items, but you might also want to check out if on activate would work better

Fires when a sub menu gets opened and its animation finished.

$("#menu").kendoMenu({
     activate: function(e) {
         // handle event
     }
});