RadMenu :: Am I able to apply RepeatColumns to a single element based on its size?

[Nick]

01.<telerik:RadMenu runat="server" Skin="Menu_New" ID="RadMainMenu" Style="z-index: 5" ExpandDelay="1000"
02.    DataSourceID="SqlDataSourceMainMenu" DataFieldID="Id" DataFieldParentID="ParentId" DataTextField="Text"
03.    EnableRoundedCorners="true" EnableEmbeddedSkins="false" EnableShadows="true"
04.    OnItemDataBound="RadMainMenu_ItemDataBound" OnItemClick="RadMainMenu_ItemClick">
05.
06.    <CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation>
07.
08.    <DefaultGroupSettings RepeatColumns="3" RepeatDirection="Horizontal" />
09.
10.</telerik:RadMenu>

I added the "DefaultGroupSettings" line and yes, every menu option was now a 3 bar menu. However, I need to be able to apply this to the menu options that actually have more than  "x" items in them.


Any help with this would be greatly appreciated.


Thanks,

[Magdalena]

Hi Nick,

The property RepeatColumns can be set dynamically on server side according to number of items. You can look for items which have three or more child items and then set to such items the property RepeatColumns as the following
C#:

foreach (RadMenuItem item in  menu1.Items)
{
    int itemsCount = (item as RadMenuItem).Items.Count;
    int maxItemInRow = 3;

    if (itemsCount > maxItemInRow)
    {
        item.GroupSettings.RepeatColumns = 3;
    }
}

 Please, find a sample solution in the attachment.

Regards,
Magdalena
Telerik

 

 

[Nick]

That worked, ty! One other question on this topic, I'm very new to Telerik so I'm learning as I go. When a "control" is used (like this one for example) are there predefined classes/id's that are assigned to the elements?

The reason I'm asking is because I'm trying to create a VERY specific menu design and while I was able to whip it out in css, I'm having a hard time understanding the telerik output to see if I can incorporate it.

Here's what I'm trying to do (attached file)::

I want submenu titles that could or could not be links, now I'd typically identify them during their creation (this time from a DB call) and assign an id/class to them to know, however, I'm not entirely sure I can do that with this control.

Any help or direction on this would be great.

Thank you!

[Ivan Zhekov]

Hello, NIck.

You are on the right path -- with server binding you can pretty much assign any class name to radmenu items depending on the conditions you need.

Examine the attached file. In it I am binding RadMenu to XML (for simplicity). The fields in the XML file correspond to fields RadMenuItems thus I am able to assign the a class name to a given node.

Of course this can be done in many other ways: for instance you could use the mappings (DataBindings) to achieve similar results.

Of course the above two require that you actually have the class name as a field be it in XML or as a field somewhere in the data object.

Ultimately, you can use ItemDataBound event (http://www.telerik.com/help/aspnet-ajax/menu-server-side-item-data-bound.html). Apart from the item currently bind, you also have the data item so you have more options to set CssClass name.

Regards,
Ivan Zhekov
Telerik