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

menu like telerik

24 Answers 369 Views

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

24 Answers, 1 is accepted

answered on 30 May 2011, 01:20 PM

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.

answered on 30 May 2011, 02:22 PM

<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>

answered on 05 Jun 2011, 01:10 PM

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="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>

</ItemTemplate>

</telerik:RadMenuItem>

</Items>

</telerik:RadMenuItem>

</Items>

</telerik:RadMenu>

megamenu should not be collapsed

answered on 06 Jun 2011, 04:09 PM

ComboBoxinMenuItemTemplate.zip

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.

answered on 29 Jul 2011, 10:24 AM

megamenuwithsubmenu.jpg

Hi,

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

answered on 07 Sep 2011, 01:58 PM

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 >>

answered on 18 Oct 2011, 08:25 AM

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.

answered on 03 May 2012, 10:28 AM

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