I have telerik:RadListBox. I have a tooltip manager .
<telerik:RadToolTipManager runat="server" ID="radTTMgr" CssClass="prodOPB" Position="BottomRight" RelativeTo="Element" Width="180px" Height="100px" Animation="Fade" ShowCallout="false" OffsetX="-70" OffsetY="-1" ShowDelay="0" ShowEvent="OnClick" OnAjaxUpdate="OnAjaxUpdate" Skin="MySkin" HideEvent="LeaveTargetAndToolTip" EnableEmbeddedSkins="false" ></telerik:RadToolTipManager>On RadListBox OnItemDataBound I add controls to target controls collection
Control image = e.Item.FindControl("imgMenu");this.radTTMgr.TargetControls.Add(image.ClientID, e.Item.DataKey.ToString(), true);Everything is working fine except one minor thing that needs to be adjusted. When I do following sequence tooltip closes
1. Click on target
2. Move mouse to tooltip
3. Move back to target and tooltip disappears.
At the same time as I do step 3 my ListItem is getting a “hover” class, so I’m wondering if that’s what causes my issue. I tried to use OnClientBeforeHide to cancel close if my mouse is over target control but I could not figure that out. Can you please help
Thank you
6 Answers, 1 is accepted
Rank 1
I think you can set the HideEvent property to "ManualClose" and that should solve your problem. The tooltip will display until you manually close it by clicking the X in the upper right corner, or trigger a different tooltip.
I hope this is what you're looking for!
-Gimmik
Rank 1
No, requirement states that I should hide tooltip when user leaves Target or tooltip and that’s exactly why I use HideEvent="LeaveTargetAndToolTip". It seems too me that’s a bug and I need to know how to work around it
Rank 1
Yea - I can see what you're talking about. I went to the demo link (below) and inputted the properties from your code snippet. The same thing happened to me where the tooltip disappeared. The documentation seems to imply that the tooltip should remain on the page while moving between the tooltip and the target. Honestly, when I have an issue like this I usually submit my whole project to Telerik support. You may want to try that. Sorry I wasn't able to help.
-Gimmik
http://demos.telerik.com/aspnet-ajax/tooltip/examples/default/defaultcs.aspx
We actually recently found that when ShowEvent is different than OnMouseOver and HideEvent="LeaveTargetAndTooltip", if the mouse enters the tooltip and gets back on the target, the tooltip unexpectedly hides. This problem is already fixed and the fix will be available in the next internal build as well in later releases (I recommend to wait until the upcoming SP, which is scheduled for next week), upgrade to it and test again.
Greetings,Svetlina
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.
Rank 1
OnClientBeforeHide so I can cancel close event? We need to do a lot of testing before new version of Telerik is approved to go to prod
Basically, checking whether the mouse position is on the target and cancelling the hide is what you need but you cannot get the mouse position with that setup under all browsers correctly because you do not have the event passed to the OnClientBeforHide handler. That is why the possible solutions without upgrade are as follows:
1) We can provide an override if you request such - it will make things work with the current settings without the need to add further custom code. However, I do not recommend this because it could cause issues in later upgrades.
2) You can set HideEvent="FromCode" and implement the desired logic. I prepared for you some sample code which you can use as a start point and improve further if you want:
<%@ Page Language="C#" %> <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> <!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> <form id="form1" runat="server"> <asp:ScriptManager ID="m" runat="server"> </asp:ScriptManager> <script type="text/javascript"> var keepActive = true; function OnClientShow(sender, args) { var target = sender.get_targetControl(); if (!target) return; var popupElemenet = sender.get_popupElement(); target.onmouseout = function () { keepActive = false; setTimeout(function () { sender.hide(); }, sender.get_hideDelay()); } popupElemenet.onmouseout = function (e) { if (!e) e = window.event; keepActive = $telerik.isMouseOverElementEx(target, e); setTimeout(function () { sender.hide(); }, sender.get_hideDelay()); }; popupElemenet.onmouseover = function () { keepActive = true; }; } function OnClientBeforeHide(sender, args) { args.set_cancel(keepActive); } </script> <telerik:RadToolTipManager runat="server" ID="radTTMgr" CssClass="prodOPB" Position="BottomRight" RelativeTo="Element" Width="180px" Height="100px" Animation="Fade" ShowCallout="false" OffsetX="-70" OffsetY="-1" ShowDelay="0" ShowEvent="OnClick" HideEvent="FromCode" OnClientBeforeHide="OnClientBeforeHide" OnClientShow="OnClientShow"> <TargetControls> <telerik:ToolTipTargetControl TargetControlID="target" /> </TargetControls> </telerik:RadToolTipManager> <asp:HyperLink ID="target" runat="server" Text="Show Tooltip"></asp:HyperLink> </form> </body> </html> I hope that my reply and the developed workaround are helpful and for your convenience I attached my test demo page - let me know how it goes.
All the best,Svetlina
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.