menu like telerik

25 posts, 0 answers
  1. Tom
    Tom avatar
    10 posts
    Member since:
    May 2010

    Posted 21 Jun 2010 Link to this post

    I just downloaded the trial version and I am trying to config the menu to make it look like the menu on telerik homepage.  Look like it using tabstrip and menu with template?  Can you give me the hints and is there an example? Thanks.
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 22 Jun 2010 Link to this post

    Hello,


    You can achieve this by using ItemTemplate for RadMenuItem. A similar scenario is demonstrated here. Check out this demo.
    Mega Drop-Down


    -Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Tom
    Tom avatar
    10 posts
    Member since:
    May 2010

    Posted 23 Jun 2010 Link to this post

    Thanks.
  5. Nitish
    Nitish avatar
    11 posts
    Member since:
    Mar 2011

    Posted 30 Mar 2011 Link to this post

    I am using mega dropdown menu.
    Will anybody tell me how can I use multi theme mega dropdown menu.
    I mean to say whenever i change the theme, mega menu dropdown converts into that theme.
  6. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 30 Mar 2011 Link to this post

    Hello Nitish,

    We currently do not support different skins of the MegaDrop-Down menu. If you need to customize the look of the menu you can change it by using the current Style.css file that is applied in the demo here.

    Best wishes,
    Kate
    the Telerik team
  7. Nitish
    Nitish avatar
    11 posts
    Member since:
    Mar 2011

    Posted 30 May 2011 Link to this post

    I am using mega drop down menu.In that drop down menu i have used radcombo box to fill the items.But when i going to select the options, the menu section slided and closed.Menu should be stay at the time of selection. Textbox is working fine but Radcombox is not working.
    Please give me urgent solution if it is possible.
  8. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 30 May 2011 Link to this post

    Hello Gray,

     In order to keep the dropdown open while changing the selection of the list box, a better approach is to try from the client side. Attach the OnClientDropDownClosing event to the RadComboBox and use the following code in the handler.

    Javascript:
    function OnClientDropDownClosing(sender, args)
       {
           if (args.get_domEvent().target == sender.get_imageDomElement())
           {
               args.set_cancel(false);
           }
           else
           {
               args.set_cancel(true);
           }
     }

    Thanks,
    Princy.
  9. Nitish
    Nitish avatar
    11 posts
    Member since:
    Mar 2011

    Posted 30 May 2011 Link to this post

    <telerik:RadComboBox ID="Cmbname" runat="server"  Width="140px" EmptyMessage="Select Views">
               <Items>
                <telerik:RadComboBoxItem Value="0" Text="Select Views" />
                 <telerik:RadComboBoxItem Value="1" Text="My Views" />
                 <telerik:RadComboBoxItem Value="2" Text="Groups View" />
                 <telerik:RadComboBoxItem Value="3" Text="Global Views" />
                 </Items>
    </telerik:RadComboBox>
    Princy,
    I am talking about mega menu behind the radcombo box is closed instantly.The above code i am using in Radmenu item(Mega menu).When i select any radcombobox item, radcombobox item list remains there and radmenu behind it closed instantly. But mega radmenu should also be there at the time of selected radcombobox item.
    Please reply asap
                                                                                              </telerik:RadComboBox>
  10. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 02 Jun 2011 Link to this post

    Hello Nitish,

    Please take a look at the following help article that explains how you can control when the menu should expand and collapse.

    Greetings,
    Kate
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  11. Nitish
    Nitish avatar
    11 posts
    Member since:
    Mar 2011

    Posted 05 Jun 2011 Link to this post

    Thanks. But this is not helpful for me.
    you guys can not able to help me. :)

    Actually my problem is not to click the menu.
    I am using telerik mega menu and in that i am showing one dropdown list. when i select any option from dropdown list, the mega menu collapse and only list is left there.this is the issue. I want when i select option from dropdown list then
    <telerik:RadMenu runat="server" ID="RadMenu1" Skin="Sitefinity"  
                                       Width="700px" Height="60px" EnableShadows="true" CollapseAnimation-Type="OutSine" >
                                       <Items>
                                           <telerik:RadMenuItem Text="Home" PostBack="false" ImageUrl="~/Content/images/megamenu/Home_new1.png"
                                               NavigateUrl="Default.aspx">
                                               <Items>
                                               </Items>
                                           </telerik:RadMenuItem>
                                           <telerik:RadMenuItem Text="Ticket" PostBack="false" NavigateUrl="Ticket/Ticket.aspx"
                                               ImageUrl="Content/images/megamenu/ticket.png" GroupSettings-OffsetX="118">
                                               <Items>
                                                   <telerik:RadMenuItem CssClass="Events" Width="640px">
                                                       <ItemTemplate>
                                                           <div id="CatWrapper" class="Wrapper">
                                                               <h3 style="font-family: Arial;">
                                                                   Tickets</h3>
                                                               <table width="100%" cellspacing="0" cellpadding="0" border="0" >
                                                                   <tr>
                                                                       <td style="width: 20%; vertical-align: top;">
                                                                           <asp:Image name="world" ImageUrl="~/Content/images/megamenu/My-Tickets1.png" runat="server"
                                                                               ID="world" />
                                                                                                                                              </td>
                                                                       <td style="width: 80%; vertical-align: top; padding: 5px 2px 5px 5px; text-align: left;">
                                                                           <table width="100%">
                                                                               <tr>
                                                                                   <td valign="top">
                                                                                       <table style="float: right; padding-right: 10px;">
                                                                                           <tr>
                                                                                               <td style="color: #5A7994">
                                                                                                   <asp:Label ID="lblSearch" runat="server" Text="Open :"></asp:Label>
                                                                                               </td>
                                                                                               <td>
                                                                                                   <asp:TextBox ID="txtSearch" runat="server" Width="200px" BorderStyle="None" Height="22px" BorderWidth="0"
                                                                                                       Style="background-image: url(../Content/images/megamenu/RootItemBg3.png); background-position: 100px -10px;
                                                                                                       color: #fff; font-family:Arial"></asp:TextBox>
                                                                                                   <asp:CompareValidator ID="cmpSearch" runat="server" ControlToValidate="txtSearch" 
                                                                                                   Type="Integer" Display="Dynamic"   Operator="DataTypeCheck" ErrorMessage="Value must be integer!" />
                                                                                               </td>
                                                                                               <td>
                                                                                                   <asp:ImageButton ID="ImgGo" OnClick="ImgGo_OnClick" AlternateText="For Search" ImageUrl="~/Content/images/megamenu/go.png"
                                                                                                       runat="server" style="cursor:pointer" />
                                                                                               </td>
                                                                                           </tr>
                                                                                       </table>
                                                                                   </td>
                                                                               </tr>
                                                                               <tr>
                                                                                   <td style="padding: 10px 0px 10px 0px;">
                                                                                   </td>
                                                                               </tr>
                                                                               <tr>
                                                                                   <td>
                                                                                       <table>
                                                                                           <tr>
                                                                                               <td style="vertical-align:top;">
                                                                                                   <telerik:RadSiteMap runat="server" ID="RadSiteMap2" Width="180px" Skin="Hay">
                                                                                                   <LevelSettings>
                                                                                                       <telerik:SiteMapLevelSetting Level="0" Width="180px">
                                                                                                           <ListLayout RepeatColumns="1" RepeatDirection="Vertical" AlignRows="true"/>
                                                                                                       </telerik:SiteMapLevelSetting>
                                                                                                   </LevelSettings>
                                                                                                   <Nodes>
                                                                                                       <telerik:RadSiteMapNode Value="Recent Tickets" Text="Recent Tickets" Font-Bold="true" runat="server" 
                                                                                                           <Nodes >
                                                                                                            
                                                                                                           </Nodes>
                                                                                                       </telerik:RadSiteMapNode>
                                                                                                   </Nodes>
                                                                                                   </telerik:RadSiteMap>
                                                                                                     
                                                                                               </td>
                                                                                               <td style="vertical-align:top;">
                                                                                               <telerik:RadComboBox ID="Cmbvalue" runat="server" Width="140px"  EmptyMessage="Select Template" OnClientSelectedIndexChanging="Cmbvalue_OnClientSelectedIndexChanging"></telerik:RadComboBox>
                                                                                                
                                                                                                 <telerik:RadButton ID="btnfind" OnClick="btnfind_OnClick" Text="<%$ Resources:Ticket, New_Ticket%>"  runat="server" Visible="true" ></telerik:RadButton>
                                                                                               <br /><br />
                                                                                               <a class="moreLink" href="Ticket/Ticket.aspx">« Views »</a>
                                                                                               <br /><br />
                                                                                               <a class="moreLink" href="Ticket/Ticket.aspx">« My Folder »</a>
                                                                                               </td>
                                                                                           </tr>
                                                                                       </table>
                                                                                         
                                                                                   </td>
                                                                               </tr>
                                                                           </table>
                                                                       </td>
                                                                   </tr>
                                                               </table>
                                                                 
                                                           </div>
                                                       </ItemTemplate>
                                                   </telerik:RadMenuItem>
                                               </Items>
                                           </telerik:RadMenuItem>
                                           <telerik:RadMenuItem Text="Assets" Enabled="true" ImageUrl="Content/images/megamenu/assets.png"
                                               PostBack="false" >
                                           </telerik:RadMenuItem>
                                           <telerik:RadMenuItem Text="People" PostBack="false" NavigateUrl="People/PeopleList.aspx"
                                               ImageUrl="Content/images/megamenu/clients.png">
                                               <Items>
                                               </Items>
                                           </telerik:RadMenuItem>
                                           <telerik:RadMenuItem Text="Admin" PostBack="false" NavigateUrl="Configure/ImpactList.aspx"
                                               ImageUrl="Content/images/megamenu/configure_new.png" GroupSettings-OffsetX="200">
                                               <Items>
                                                   <telerik:RadMenuItem CssClass="Events" Width="640px">
                                                       <ItemTemplate>
                                                           <div id="CatWrapper" class="Wrapper" style="width: 435px;">
                                                               <h3 style="font-family: Arial;">
                                                                   Admin</h3>
                                                               <telerik:RadSiteMap ID="RadSiteMap1" runat="server" Skin="Hay">
                                                                   <LevelSettings>
                                                                       <telerik:SiteMapLevelSetting Level="1">
                                                                           <ListLayout RepeatColumns="3" RepeatDirection="Vertical" />
                                                                       </telerik:SiteMapLevelSetting>
                                                                   </LevelSettings>
                                                                   <Nodes>
                                                                       <telerik:RadSiteMapNode NavigateUrl="#" Text="Configure">
                                                                           <Nodes>
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/ImpactList.aspx" Text="Impact" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/UrgencyList.aspx" Text="Urgency" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/PriorityList.aspx" Text="Priorities" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="~/PriorityMatrix/Index" Text="Priority Matrix" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/Categories.aspx" Text="Categories" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/TypeList.aspx" Text="Ticket Types" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/ItemList.aspx" Text="Ticket Items" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/StatusList.aspx" Text="Ticket Status" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/TypeList.aspx" Text="Ticket Types" />                                                                             
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/ChangeTypes.aspx" Text="Change Types" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/ChangeStatus.aspx" Text="Change Status" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/ChangeReasons.aspx" Text="Change Reasons" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/ViewsList.aspx" Text="Manage Views" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/HolidayList.aspx" Text="Holiday" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/OperatingHoursList.aspx" Text="Operating Hours" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/DepartmentList.aspx" Text="Departments" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="Configure/SystemSettings.aspx" Text="System Settings" />                                                                           
                                                                               <telerik:RadSiteMapNode NavigateUrl="#" Text="User Settings" />                                                                            
                                                                               <telerik:RadSiteMapNode NavigateUrl="#" Text="ToolBar Configuration" />
                                                                           </Nodes>
                                                                       </telerik:RadSiteMapNode>
                                                                       <telerik:RadSiteMapNode NavigateUrl="Ticket/Ticket.aspx" Text="Users">
                                                                           <Nodes>
                                                                               <telerik:RadSiteMapNode NavigateUrl="Organization/OrganizationList.aspx" Text="Organizations" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="~/People/PeopleList.aspx" Text="People" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="ActiveDirectory/ADIndex.aspx" Text="Active Directory" />
                                                                           </Nodes>
                                                                       </telerik:RadSiteMapNode>
                                                                       <telerik:RadSiteMapNode NavigateUrl="#" Text="Security">
                                                                           <Nodes>
                                                                               <telerik:RadSiteMapNode NavigateUrl="~/Security/RolesList.aspx" Text="Roles" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="~/Security/GroupsList.aspx" Text="Groups" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="#" Text="Application Permission" />
                                                                           </Nodes>
                                                                       </telerik:RadSiteMapNode>
                                                                       <telerik:RadSiteMapNode NavigateUrl="#" Text="Customization">
                                                                           <Nodes>
                                                                               <telerik:RadSiteMapNode NavigateUrl="~/CustomField/Index" Text="Custom Fields" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="#" Text="Ticket Templates" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="#" Text="Ticket Templates" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="#" Text="Change Request Templates" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="#" Text="Asset Templates" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="#" Text="People Templates" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="#" Text="Organization Templates" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="EmailTemplate/EmailTemplateList.aspx" Text="Email Templates" />
                                                                               <telerik:RadSiteMapNode NavigateUrl="#" Text="Task Templates" />
                                                                           </Nodes>
                                                                       </telerik:RadSiteMapNode>
                                                                         
                                                                   </Nodes>
                                                               </telerik:RadSiteMap>
                                                           </div>
                                                                                                                                                                                                                                         </div>
                                                       </ItemTemplate>
                                                   </telerik:RadMenuItem>
                                               </Items>
                                           </telerik:RadMenuItem>
                                           
                                       </Items>
                                   </telerik:RadMenu>
    megamenu should not be collapsed
  12. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 06 Jun 2011 Link to this post

    Hello Nitish,

    Thanks for clarifying.
    I have attached a sample project where I first use z-index to bring the RadComboBox and the RadComboBox  dropdown list on top of the menu and the I apply javascript, so that the menu stays open after the section of an item from the RadComboBox. Let me know if this is what you need.

    All the best,
    Kate
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  13. Nitish
    Nitish avatar
    11 posts
    Member since:
    Mar 2011

    Posted 07 Jun 2011 Link to this post

    Thanks a lot Kate. Awesome work dear.
  14. kianno
    kianno avatar
    1 posts
    Member since:
    Jun 2011

    Posted 29 Jul 2011 Link to this post

    Hi,

    I would like to know is it possible to have submenu within a megamenu ? (refer to attach file image )

  15. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 29 Jul 2011 Link to this post

    Hi Kianno,

    In order to put a RadMenu inside the MegaDropDownMenu you need to put the new RadMenu control in an ItemTemplate of its RadMenuItem.

    Best wishes,
    Kate
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  16. Nitish
    Nitish avatar
    11 posts
    Member since:
    Mar 2011

    Posted 07 Sep 2011 Link to this post

    I am using Radgrid in many pages. I want to change the font-size of text that we used in rad grid.
    .RadGrid, .RadGrid .rgMasterTable, .RadGrid .rgDetailTable, .RadGrid .rgGroupPanel table, .RadGrid .rgCommandRow table, .RadGrid .rgEditForm table, .RadGrid .rgPager table, .GridToolTip
    {
        font-family: Segoe UI !important; 
        font-size : 25px;  
    }
    But by using this code,i can only change my font-family not the font-size. Please help me. how can i do this.
  17. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 07 Sep 2011 Link to this post

    Hello Nitish,

    in order to override the default CSS style use the !important modifier.
    CSS:
    .RadGrid, .RadGrid .rgMasterTable, .RadGrid .rgDetailTable, .RadGrid .rgGroupPanel table, .RadGrid .rgCommandRow table, .RadGrid .rgEditForm table, .RadGrid .rgPager table, .GridToolTip
    {
        font-family: Segoe UI !important;
        font-size : 25px !important;; 
    }

    Thanks,
    Princy.
  18. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 07 Sep 2011 Link to this post

    Hello Nitish,

    In order for the changes to take effect you will need to increase the specificity of the css class selectors. For example using the Default skin of the RadGrid you can add a div and thus increase the weight of the selectors so that they could be applied instead of the default ones. Here is an example:
    div.RadGrid_Default,
    div.RadGrid_Default .rgMasterTable,
    div.RadGrid_Default .rgDetailTable,
    div.RadGrid_Default .rgGroupPanel table,
    div.RadGrid_Default .rgCommandRow table,
    div.RadGrid_Default .rgEditForm table,
    div.RadGrid_Default .rgPager table,
    .GridToolTip_Default {
    /*here you can specify the font, its size etc */
        font: 17px/16px "segoe ui",arial,sans-serif;
    }

    Regards,
    Kate
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

  19. Nitish
    Nitish avatar
    11 posts
    Member since:
    Mar 2011

    Posted 12 Sep 2011 Link to this post

    I need the help to manage the time delay in radmenu toolbar. when i mouseover on menu tab, submenu <div> opens.
    I want when i mouseover on menu tab, after a pause of second, submenu<div> should be open.
    Please i need this very urgent.
  20. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 12 Sep 2011 Link to this post

    Hello Nitish,

    Try setting the ExpandDelay property to manage a time delay.
    aspx:
    <telerik:RadMenu ID="RadMenu1" runat="server" ExpandDelay="1000">
    </telerik:RadMenu>

    Thanks,
    Shinu.
  21. Nitish
    Nitish avatar
    11 posts
    Member since:
    Mar 2011

    Posted 13 Oct 2011 Link to this post

    I am using <telerik:RadFormDecorator> control to decorate the scrollbars. It is working fine in IE8 but it is not working in firefox.
    Actually i am desingning my web application based on multi theme. when i test my design on firefox scrollbar is in default mode. there is no theme concept with scrollbars.
    Please help me.
    <telerik:RadFormDecorator ID="FormDecorator1" runat="server" DecoratedControls="Scrollbars"></telerik:RadFormDecorator
  22. Rumen
    Admin
    Rumen avatar
    12846 posts

    Posted 18 Oct 2011 Link to this post

    Hi Nitish,

    Firefox does not support scrollbar decoration. Currently scroll decoration is allowed in IE and WebKit only.

    One important thing you must know about a colored scrollbar is that it does not do not work in Gecko-based browsers (Firefox, Netscape Navigator, Mozilla): It is not a standard property or a proprietary property. According to W3C, these properties are illegal: they are neither defined in any CSS specification nor are they marked as proprietary (by prefixing them with "-vendor-"). 

    Greetings,
    Rumen
    the Telerik team
    Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
  23. Nitish
    Nitish avatar
    11 posts
    Member since:
    Mar 2011

    Posted 19 Nov 2011 Link to this post

    Hello Telerik Team,
    I need your urgent help.
    Actually i am using radtoolbar in Radpageview.
    It works fine in chrome browser and firefox but it doesnt work in IE8.0 browser.Style of radtoolbar is also not working in IE8.0.
    I want to show the radtoolbar fine in any browser. specially in IE8.0.
    I'm displaying ADD,edit,delete icon in radtolbar. But in IE8, it shows vertically with no style there. Please help as soon as possible

    Thanks
    Nitish saraswat
  24. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 22 Nov 2011 Link to this post

    Hello Nitish,

    Can you please provide either a live url or a simplified runnable page where we can observe the issue and see the appearance in IE8? Thus, we could inspect it locally and help you in your particular scenario.  

    Kind regards,
    Kate
    the Telerik team
    Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
  25. Nitish
    Nitish avatar
    11 posts
    Member since:
    Mar 2011

    Posted 03 May 2012 Link to this post

    Hello Telerik team,
    One major issue is coming in my application.i tell you the full scenerio.
    I have take two radpane using one splitter.in left hand pane, there is a menu option and on right handside, the page display when we click the option from the left pane items.In the right hand side i have taken one radgrid using static header="true" property and the pagesize property.
    The issue is when we change the page size 10 to 20 or 50.It shows all the rows but there is one big scrollbar coming with white space specially in IE8 and FF browser. it work fines in chrome browser.
    I have rectify the issue and in that i have found that height of inbulid Iframe scroll bar is coming.

    Please give solution as early as possible
  26. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 08 May 2012 Link to this post

    Hello Nitish,

    I would suggest that you open a support ticket where you can send us your code so we can test it locally and help you out since the information that you provided is not sufficient for us to replicate the described behavior.

    All the best,
    Kate
    the Telerik team
    Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017