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

Only want ONE tooltip!

3 Answers 43 Views
ToolTip
This is a migrated thread and some comments may be shown as answers.
Sime
Top achievements
Rank 1
Sime asked on 22 Jun 2011, 01:29 PM
I'm using a RadToolTipManager and setting the body of my Tooltip in the .Text property (serverside).

I then add lots of tables cells to the TargetControls collection.

All works fine.

However, I want to call some javascript functions triggered by jQuery event listeners attached to elements with a known id within my Tooltip markup - e.g. a button.

This is only working for the Tooltip shown on the first table cell I hover over.

Looking at the source code, I see that a separate ToolTip is generated for EVERY cell I hover over.

This means the same id's appear multiple times - not only is this bad HTML but my triggers only work on the first one.

Is there a way to force the RadToolTipManager to only ever create one Tooltip and show that every time?

Thanks

3 Answers, 1 is accepted

Sort by
0
Marin Bratanov
Telerik team
answered on 23 Jun 2011, 11:05 AM
Hello Sime,

The RadToolTipManager creates a tooltip for every target control by design. It looks like you are setting the Text property with an HTML string where you create the buttons in the markup and this would, expectedly, result in many buttons with the same id appearing in the markup. This is because the intended use of the Text property is to set a simple string, not HTML content.

If you wish to have a more complex content in the tooltip you should use the OnAjaxUpdate event and load a user control in the ToolTipManager's update panel. In this way only one button will exist on the page in any given time.

  Another option would be to create a RadToolTip for every target control and not use the ToolTipManager. You could also use a single RadToolTip and use the targets' events to show it and hide it.

Yet another possible solution is to define a way to give unique IDs to the buttons you create (for example by using the DateTime.Now.Millisecond property).

Please examine the following demo for the difference in the way rich content is loaded in the ToolTIp and in the ToolTipManager: http://demos.telerik.com/aspnet-ajax/tooltip/examples/loadondemand/defaultcs.aspx.
You can also take a look at the following demo showing the more general differences between the two controls: http://demos.telerik.com/aspnet-ajax/tooltip/examples/tooltipversustooltipmanager/defaultcs.aspx.

I hope the information above will help you decide which controls better suits your scenario.


Best wishes,
Marin
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.

0
Sime
Top achievements
Rank 1
answered on 23 Jun 2011, 01:40 PM
Hi Marin,

OK, I understand more how it works now.

Yes, I was assigning HTML markup to the .Text property.

I don't want to use the OnAjaxUpdate method as I feel UpdatePanels are very heavy - I'm now populating my ToolTip via a web service rather than the .Text property - and obviously getting the same issues of repetition of ID's. However, perhaps if I clear the previous tooltip's contents by using the JavaScript OnClientHide event it may circumvent this issue.

However, I think I may use your idea of defining a single ToolTip and use jQuery to add the triggers to show it to my table cell elements.
This seems like a really efficient idea. Not sure how I'd handle the web service or how positioning will work then though. I'll look into it!

0
Marin Bratanov
Telerik team
answered on 24 Jun 2011, 11:00 AM
Hello Sime,

By using a WebService you also pass a simple string to the ToolTIpManager which is equivalent to the Text property and thus you get the same behavior again.

Indeed, you may attach to the OnClientHide event and use set_text("") to clear the contents. If this approach works for your scenario then it is fine.

  My idea for a single ToolTip involves using the RadToolTIp (which does not support a WebService) and regular events such as onfocus, onblur, onmouseover, onmouseout. If you set the correct targetControlID every time before you show the tooltip it will position itself correctly as its internal mechanisms will kick in. As for the text - I was left with the impression that you were using a static string, so you could just set it declaratively between the RadToolTIps tags as HTML content.

I believe you may also find the following demos useful on the available client-side API and on how to show/hide tooltips:
http://demos.telerik.com/aspnet-ajax/tooltip/examples/radtooltipmanagerclientapi/defaultcs.aspx
http://demos.telerik.com/aspnet-ajax/tooltip/examples/clientsideapi/defaultcs.aspx




Kind regards,
Marin
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.

Tags
ToolTip
Asked by
Sime
Top achievements
Rank 1
Answers by
Marin Bratanov
Telerik team
Sime
Top achievements
Rank 1
Share this question
or