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

Vertical RadMenu with horizontal submenus

6 Answers 762 Views
Menu
This is a migrated thread and some comments may be shown as answers.
aman
Top achievements
Rank 1
aman asked on 01 Oct 2008, 07:40 AM
Hi there
 I am using Rad-menu for an application. I want to display rad-menu in following format

Mainmenuitem1: Subitem1-subitem2-subitem3
mainitem2: subitemA- subitemB-subitemC
mainitem3

Vertical Menu Items with Horizontal Submenus
Please advise how to do this.
Thanks

6 Answers, 1 is accepted

Sort by
0
Serrin
Top achievements
Rank 1
answered on 06 Oct 2008, 09:01 PM
Hello Aman,

You would set the menu Flow to vertical and then set the menuitem GroupSettings Flow property to horizontal, like this:

        <telerik:RadMenu ID="RadMenu1" runat="server" Flow="Vertical">  
<CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation> 
            <Items> 
                <telerik:RadMenuItem runat="server" Text="Root RadMenuItem1">  
                    <Items> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 1">  
                        </telerik:RadMenuItem> 
                        <telerik:RadMenuItem runat="server" Text="Child RadMenuItem 2">  
                        </telerik:RadMenuItem> 
                    </Items> 
                    <GroupSettings Flow="Horizontal" /> 
                </telerik:RadMenuItem> 
                <telerik:RadMenuItem runat="server" Text="Root RadMenuItem2">  
                </telerik:RadMenuItem> 
 
            </Items> 
        </telerik:RadMenu> 

:)
0
Jains
Top achievements
Rank 1
answered on 18 Feb 2010, 09:44 PM
I'm creating a Radmenu dynamically and both parent items and child items are to be veritcal. 

How do a code that? This does not work
RadMenuItem item = new RadMenuItem();
item.GroupSettings.Flow = Item Flow.Vertical;

0
Yana
Telerik team
answered on 19 Feb 2010, 08:08 AM
Hello Jains,

It should be set like this:

item.GroupSettings.Flow = Telerik.Web.UI.ItemFlow.Vertical;


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
Jains
Top achievements
Rank 1
answered on 19 Feb 2010, 01:47 PM
Hi Yana
unfortunately this did not work  
item.GroupSettings.Flow = Telerik.Web.UI.ItemFlow.Vertical;

<style type="text/css">  
 .RadMenu_Web20 .rmRootGroup .rmSeparator  
 {  
      
    border:none !important;  
     height:1px;  
    background-color:#d4e2f1;     
    background-image: none !important;   
      
 }  
 </style> 
 <div> 
     
      <table  style="margin-top:20px;  
    margin-bottom:0px;  
     font-family: Arial;  
     margin-left: auto;  
     margin-right: auto;  
     border-width:0px;   
     padding-left:0px;  
     padding-right:0px;  
     width:150px;  
     padding-top:0px;  
      padding-bottom:0px;"> 
   <tr> 
   <td  align="left" width="145px"><p>&nbsp;</p> 
   
 
<telerik:RadMenu ID="RadMenu1" runat="server"      
ForeColor="#00338E"    
BackColor="#D5E2EA"    
Width="150px"    
OnItemClick="RootMenuItem_Click"   
    
 
style=" position: relative; top: -34px;  left: 0px; padding:0px;"    Skin="Web20" Flow="Vertical">  
     </telerik:RadMenu> 
     
   </td> 
   </tr> 
   </table> 
    </div> 
       
 
protected void LoadMenuFromtbMenu(int id, int selected)  
        {  
            System.Drawing.Color bgColor = System.Drawing.ColorTranslator.FromHtml("#e7edf6");  
 
            using (XcendaDC1DataContext db = new XcendaDC1DataContext())  
            {  
                var query = from t in db.tbMenuDetails  
                            where t.m_identity == id  
 
                            select new  
                            {  
                                t.m_identity,  
                                t.md_identity,  
                                t.md_navigateUrl,  
                                t.md_title  
                            };  
 
                if (query.Count() > 0)  
                {  
                    RadMenuItem item;  
                    foreach (var i in query)  
                    {  
                        item = new RadMenuItem();  
                        item.GroupSettings.Flow = Telerik.Web.UI.ItemFlow.Vertical;  
                        item.ForeColor = System.Drawing.Color.Navy;  
                        item.BackColor = bgColor;  
                        iitem.Text = i.md_title;  
                        iitem.Value = i.md_navigateUrl + "?id=" + i.md_identity;  
 
                        if (selected == i.md_identity)  
                        {  
                            item.Selected = true;  
 
                        }  
                        // query the next menu level   
                        RadMenuItem subMenuItem = GetNextMenuLevel(i.md_title, selected);  
 
                        subMenuItem.GroupSettings.Flow = Telerik.Web.UI.ItemFlow.Vertical;  
                        item.Items.Add(subMenuItem);  
                         
                        this.RadMenu1.Items.Add(item);  
 
                        item = new RadMenuItem();  
                        item.IsSeparator = true;  
                         
                         this.RadMenu1.Items.Add(item);  
                          
                          
                    }  
 
                }  
            }  
 
              
        }  
 
0
Yana
Telerik team
answered on 23 Feb 2010, 02:33 PM
Hello Jains,

I'm sorry for my mistake, you should set it to "Horizontal"  for horizontal subitems:

item.GroupSettings.Flow = Telerik.Web.UI.ItemFlow.Horizontal;

I've attached a simple page based on your code to demonstrate this.

Best regards,
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
Gandharv
Top achievements
Rank 1
answered on 06 Jul 2012, 08:43 AM
Thanks... Helpful material.
Tags
Menu
Asked by
aman
Top achievements
Rank 1
Answers by
Serrin
Top achievements
Rank 1
Jains
Top achievements
Rank 1
Yana
Telerik team
Gandharv
Top achievements
Rank 1
Share this question
or