Tooltip show Alt text of targetControl instead of content

[James Van Buren]

Hi, is this a new designed behaviour?
We started getting all tooltips just show value of ALT text of an image which is a TargetControl instead of an actual content that is inside of the Tooltip.
Is there a way to disable this other than removing alt tags from target controls?

I do not have tooltip manager, i just have Tooltip controls on the page.

[Svetlina Anati]

Hello James,

You are correct that the behavior is changed as explained in the release notes. Note, however, that one of the main purposes [among others] of RadToolTip is to be used as a replacement of the "standard browser tooltip". This is the reason that the tooltip, as its highest priority reads the title or alt attribute of the element (as it is the title/alt attribute that causes a browser tooltip to be displayed).

As a result, in fact there are 4 ways to display content in a tooltip - by reading its TargetControl's title attribute, by setting the RadToolTip's Text property, or by writing HTML between the RadToolTip opening and closing tags.

Here is the correct priority for the three approaches to setting the RadToolTip content:

1. RadToolTip Text property
2. [target control] title attribute / ToolTip server property
3. alt attrinute/AlternateText server property
4. RadToolTip content between opening/closing tags

Since the tooltip manager used to work like above explained from its creation when autotooltipify is used, we got customers` requests to make this behavior consistent and the same for the separate RadToolTip as well.

What I can suggest to do in order achieve what you need is to use some simple js code as the one shown below which I prepared for you:

<form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <script type="text/javascript">

    function setToolTip()
    {
       var img = $get("<%=imgRating.ClientID %>");
       var alt = img.getAttribute('alt');
       var regTooltip = img.getAttribute('regulartooltip');
       if(!alt || alt == '') img.setAttribute('alt', regTooltip);
    }

    </script>
    <img src="Sunset.jpg" runat="server" onmouseover="setToolTip();"
        regulartooltip="myStandardTooltip" id="imgRating" alt="Rate this Page" width="55"
        height="16" />
    <telerik:RadToolTip runat="server" ID="tipRating" Title="What do you think?" Skin="Office2007"
        Animation="None" xManualClose="true" Sticky="false" ShowEvent="OnMouseOver" HideEvent="LeaveTargetAndToolTip"
        Width="275" Position="BottomLeft" RelativeTo="Element" OffsetX="0" OffsetY="0"
        TargetControlID="imgRating" IsClientID="false">
        Enter an optional comment with your rating:
        <textarea id="tbRatingComment" rows="3" cols="30"></textarea>
        <small>Report technical problems with this site to the <a href="mailto:[e-mail]">
            webmaster</a>.</small>
    </telerik:RadToolTip>
</form>

I hope that the prepared code is helpful and for your convenience I attached a sample demo, let me know how it goes.

Greetings,
Svetlina
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.