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

Setting menu item css style onclientitempopulated event

3 Answers 33 Views
Menu
This is a migrated thread and some comments may be shown as answers.
James
Top achievements
Rank 1
James asked on 15 Jun 2010, 09:28 PM

I'm sure I'm missing something simple here...

I have menu where the root nodes are loaded in the code behind and the child menu items are loaded on demand via a web service.  I need to apply a different css style to child menu items of a specific root item.  I thought I could do this on the OnClientItemPopulated event with the following code:

            function itemPopulated(sender, eventArgs)  
            {  
                var item = eventArgs.get_item();  
                if (item && item.get_value() == "myValue")  
                {  
                    for (var i=0; i < item.get_items().get_count(); i++)  
                    {  
                        item.get_items().getItem(i).set_cssClass("myCssClass");  
                    }  
                }  
            } 

However, I noticed that the style for the items, as the menu is expanding and when it is open, is the default style and that my applied style only takes effect as the menu is closing.  What am I missing?

3 Answers, 1 is accepted

Sort by
0
James
Top achievements
Rank 1
answered on 17 Jun 2010, 09:55 PM
Still waiting...

If it helps here is the css:
.RadMenu_Black a.myCssClass .rmText {color:Yellow !important;} 

0
Accepted
Yana
Telerik team
answered on 21 Jun 2010, 09:43 AM
Hi James,

The style is applied after the menu item is expanded. Please change your code like this:

1. subscribe to OnClientItemPopulating instead and in its handler:

function itemPopulating(sender, eventArgs) {
     var item = eventArgs.get_item();
     if (item && item.get_value() == "132") {
         item.get_element().className += " myCssClass";
     }
}

2. change the css selector like this:

.RadMenu li.myCssClass .rmGroup .rmText {color:Yellow !important;}

Greetings,
Yana
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
James
Top achievements
Rank 1
answered on 21 Jun 2010, 05:13 PM
Thanks Yana, I can confirm this works.

I should have thought of trying it this way.  At one point I was trying the itempopulating method but was trying to set the style on the child items - which at that point, didn't exist yet.


Tags
Menu
Asked by
James
Top achievements
Rank 1
Answers by
James
Top achievements
Rank 1
Yana
Telerik team
Share this question
or