
If the target hyperlink has its ToolTip property set, then the tooltip uses that text as its content and ignores the content I added via the Controls collection.
If the target hyperlink does not have its ToolTip property set, then the content is correctly displayed.
Is there something I need to do to override this behavior or is this a known bug?
I want the target hyperlink ToolTip/title text displayed when the user mouses over the link, and the rich content (RadTooltip.Controls) to be displayed when the user clicks the link.
6 Answers, 1 is accepted
The reason for this behavior is because by design, the different way of settings tooltip's content has different priorities for showing the RadToolTip.
The priorities are (#1 is with highest priority):
- Text property is set
- Content element is not empty (e.g. there is content between the RadToolTIps opening and closing tags)
- The tooltipified element has a title attribute
- Dynamically created tooltip to be used in AJAX load on demand scenario
We will consider changing the priority list or to provide some way by which the developer can explicitly set the desired content, but this will happen in one of the following releases of the control.
Best wishes,
Georgi Tunev
the Telerik team
Instantly find answers to your questions at the new Telerik Support Center


Did anything change? We're facing the problem like the one described by the topic starter. Please consider this code:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TelerikTest.aspx.cs" Inherits="DataTables.TelerikTest" %>
<%@ 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
>Sample page (Telerik)</
title
>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
script
type
=
"text/javascript"
>
function showTooltip(button) {
var tooltip = $find("<%=ttSample.ClientID %>");
tooltip.set_targetControl(button);
setTimeout(function () {
tooltip.show();
}, 100);
}
</
script
>
<
asp:ScriptManager
runat
=
"server"
ID
=
"scriptManager1"
></
asp:ScriptManager
>
<
div
>
<
div
><
input
title
=
'button 1'
type
=
"button"
onclick
=
"showTooltip(this); return false;"
value
=
"Button 1"
/></
div
>
<
div
><
input
title
=
'button 2'
type
=
"button"
onclick
=
"showTooltip(this); return false;"
value
=
"Button 2"
/></
div
>
<
div
><
input
title
=
'button 3'
type
=
"button"
onclick
=
"showTooltip(this); return false;"
value
=
"Button 3"
/></
div
>
</
div
>
<
telerik:RadToolTip
runat
=
"server"
ID
=
"ttSample"
ShowEvent
=
"FromCode"
HideEvent
=
"ManualClose"
RelativeTo
=
"Element"
Position
=
"MiddleRight"
>
Some funny content here
<
asp:Button
runat
=
"server"
ID
=
"btnTest"
Text
=
"Test button"
/>
</
telerik:RadToolTip
>
</
form
>
</
body
>
</
html
>
As you see, all three buttons have "title" properties set. As a result when they are clicked we see "button 1/2/3" text instead of what's inside the tooltip. It doesn't make sense. Especially if we take into account the part of your reply where you describe the priorities for showing the RadTooltip content. I guess my case is about priority #2. Though case #3 takes priority here.
Could you please give us a tip? We want usual help tooltips to be shown on our links/buttons, but we also want RadTooltips to be shown
Hello Vladimir,
The following article explains the tooltip content priorities: http://www.telerik.com/help/aspnet-ajax/tooltip-content.html. Since it is, first and foremost, a replacement for the browser tooltip, the title attribute of the target control takes priority over rich content.
Thus, the title attribute of the HTML elements will take precedence in this case and the behaviour you see is expected.
What I can offer is the following function override that will prevent tooltips from taking the title attribute of their targets. Note that it will affect all instance on the page and you should use it with care.
Telerik.Web.UI.RadToolTip.prototype._getToolTipAltText =
function
(target) {
var
targetControl = target ? target :
this
.get_targetControl();
if
(targetControl) {
var
title = targetControl.getAttribute(
"title"
);
var
ignoreAlt =
this
.get_ignoreAltAttribute();
var
alt = ignoreAlt?
null
: targetControl.getAttribute(
"alt"
);
if
(title || alt) {
if
(!ignoreAlt) {
targetControl.removeAttribute(
"alt"
);
}
//targetControl.removeAttribute("title");
//if (!this.get_text())
//{
// var content = title ? title : alt;
// this.set_text(content);
//}
}
}
}
Regards, Marin Bratanov
Telerik
Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

I'd rather do something like this before I call to show the tooltip:
$(button).removeAttr(
"title"
);
... will save title to some hidden field and will then put it back when tooltip is hidden.

function
showTooltip(button) {
var
title = $(button).attr(
"title"
);
$(button).removeAttr(
"title"
);
var
tooltip = $find(
"<%=ttSample.ClientID %>"
);
tooltip.set_targetControl(button);
setTimeout(
function
() {
tooltip.show();
$(button).attr(
"title"
, title);
}, 100);
}