Jeremy Yoder
Top achievements
Rank 1
Rank 1
Jeremy Yoder
asked on 11 Feb 2013, 05:33 PM
The page below shows the issue. When I browse to it from a mobile device, such as iPhone or Android, the menus will not drop down. It's appears there's a conflict with hovering vs clicking.
I have other code determining if the user is browsing from a mobile device or not. Knowing that, what code I can apply to my menu that will disable hovering and only make menus drop down when clicking?
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default2.aspx.vb" Inherits="Default2" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title></head><body style="background-color:White"> <script language="javascript" type="text/javascript"> function MenuItemClicking(sender, args) { var item = args.get_item(); if (item.get_level() === 0) { args.set_cancel(true); return; } alert('Menu item selected'); } </script> <form id="form1" runat="server"> <telerik:RadScriptManager ID="RadScriptManager1" runat="server" EnablePageMethods="true"> </telerik:RadScriptManager> <div> <telerik:RadMenu ID="RadMenu1" runat="server" BorderStyle="None" OnClientItemClicking="MenuItemClicking"> <Items> <telerik:RadMenuItem runat="server" Text="Data" TabIndex="-1"> <Items> <telerik:RadMenuItem runat="server" Text="Option 1"> </telerik:RadMenuItem> <telerik:RadMenuItem runat="server" Text="Option 2"> </telerik:RadMenuItem> <telerik:RadMenuItem runat="server" Text="Option 3"> </telerik:RadMenuItem> </Items> </telerik:RadMenuItem> <telerik:RadMenuItem runat="server" Text="Info" TabIndex="-1"> <Items> <telerik:RadMenuItem runat="server" Text="Option 4"> </telerik:RadMenuItem> <telerik:RadMenuItem runat="server" Text="Option 5"> </telerik:RadMenuItem> </Items> </telerik:RadMenuItem> <telerik:RadMenuItem runat="server" Text="Help" TabIndex="-1"> <Items> <telerik:RadMenuItem runat="server" Text="Option 6"> </telerik:RadMenuItem> <telerik:RadMenuItem runat="server" Text="Option 7"> </telerik:RadMenuItem> </Items> </telerik:RadMenuItem> </Items> </telerik:RadMenu> </div> </form></body></html>7 Answers, 1 is accepted
0
Hello,
In order to avoid any confusions I would like to clarify that under mobile devices clicking on a RadMenuItem is opening and showing its child items. In the provided code you are canceling the click event from executing and this prevent the drop down functionality as well. Could you please elaborate a bit more on your scenario and clarify what exactly functionality you are trying to achieve? Any additional information would be very helpful.
Regards,
Boyan Dimitrov
the Telerik team
In order to avoid any confusions I would like to clarify that under mobile devices clicking on a RadMenuItem is opening and showing its child items. In the provided code you are canceling the click event from executing and this prevent the drop down functionality as well. Could you please elaborate a bit more on your scenario and clarify what exactly functionality you are trying to achieve? Any additional information would be very helpful.
Regards,
Boyan Dimitrov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Jeremy Yoder
Top achievements
Rank 1
Rank 1
answered on 14 Feb 2013, 08:50 PM
You inadvertently answered my question. My simplified version didn't do the entire issue justice since removing the .set_cancel does make it work, but it broke other functionality we needed which had to do with hovering and certain menus behaviors. Yet I was able to get around everything, so I'll not bore you with the details.
That makes this thread a non-issue, so delete it if you want. Thanks.
0
kurt place
Top achievements
Rank 2
Rank 2
answered on 27 Jun 2013, 05:14 PM
Please, bore us with the details! I have a similar issue.
0
Jeremy Yoder
Top achievements
Rank 1
Rank 1
answered on 27 Jun 2013, 08:41 PM
I'll do my best to bore you. ;)
It was a while ago, but I made this note in my code: "Before I was manually canceling menus, but it made parent menus not work on mobile devices that can't hover mouse to make menu drop. Instead, better solution is to set PostBack="false" for parent and special menus right on the control."
So it appears that now in my control, I have PostBack="false" on my parent RadMenuItems and on any others that need to kick off code in the javascript function. And in the javascript, I'm no longer checking for .get_level or calling .set_cancel.
Hope that helps.
0
kurt place
Top achievements
Rank 2
Rank 2
answered on 27 Jun 2013, 09:32 PM
Thank you very much. I did find this out shortly after I asked but you have just confirmed it. The post I found had someone from Telerik telling someone else to set the postback = false programmatically on menu item creation but that didn't work for me since my items were created in the aspx file. but then the thought hit me to set the postback value in the aspx file as well and it worked.
Hopefully we are helping the other fools running into the same thing in the future.
Hopefully we are helping the other fools running into the same thing in the future.
0
Benjamin
Top achievements
Rank 1
Rank 1
answered on 08 Dec 2016, 02:46 PM
I have a similar error with the menu on RenderMode="Mobile". The menu for the mobile won't drop down if I click on the menu icon.
Need a solution ASAP!
0
Hello ,
I assume that you had go trough the recommended suggestion in this thread and the problem still persist. This is why, I would like to ask you to elaborate a bit more on your scenario - provide us with steps for the replication of the issue and the current implementation that you have. Hence, we will be able to replicate it locally and suggest you the proper implementation or a workaround.
Regards,
Nencho
Telerik by Progress
I assume that you had go trough the recommended suggestion in this thread and the problem still persist. This is why, I would like to ask you to elaborate a bit more on your scenario - provide us with steps for the replication of the issue and the current implementation that you have. Hence, we will be able to replicate it locally and suggest you the proper implementation or a workaround.
Regards,
Nencho
Telerik by Progress
Telerik UI for ASP.NET AJAX is ready for Visual Studio 2017 RC! Learn more.