Rad tool tip for ItemTemplate inside of RadGrid not displaying

[Justin]

Hello, I will attempt to articulate my problem as best I can. Let me start off by saying I and my co-workers thoroughly enjoy your products.

I have a RadGrid with a variety of columns, which currently have asp tool tips that I am trying to convert to using Telerik's rad ToolTip control. Two of the columns in particular are grid template columns that have link button and image controls inside of the ItemTemplate tags respectively.
Like this:

<telerik:GridTemplateColumn ItemStyle-HorizontalAlign="Center" AllowFiltering="false" UniqueName="UniqueImageName">
   <ItemTemplate>
      <asp:Image ID="imgSomeimageName" runat="server" />
    </ItemTemplate>
</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn ItemStyle-HorizontalAlign="Center" AllowFiltering="false" >
   <ItemTemplate>
      <asp:LinkButton ID="lbtnSomebutton" runat="server" CommandArgument='<%# Eval("ObjectID") %>'
      OnCommand="lbtnSomebutton_Command" Enabled='<%# Eval("SomeThingEnabled")
      %>'meta:resourcekey="lbtnSomebutton">
         <asp:Image ID="imgSomeButtonIcon" runat="server" ImageUrl="~/Images/SomeButtonIcon.gif" Visible='<%#
         Eval("SomethingHasValue") %>'  />
      </asp:LinkButton>
     </ItemTemplate>
</telerik:GridTemplateColumn>

I have tried adding tool tips to the grid and to these two items specifically via two methods, which both have yielded unexpected results.

First by simply adding the Rad ToolTip Manager control and setting the AutoToolTipify property to true.
Like this:

<telerik:RadToolTipManager runat="server" RelativeTo="Element" Position="Center"
    ID="radToolTipMgr1" HideEvent="LeaveTargetAndToolTip" AutoTooltipify="true" Width="375px" OffsetY="-1"
    OnAjaxUpdate="OnAjaxUpdate">
</telerik:RadToolTipManager>

When this method is used however it seems any tool tips specific to certain rows and columns are lost and only the tool tips specified for the radgrid  as a whole are displayed. In other words if I have something like RadGrid1.ToolTip = "HelloWorld" in the .resx file, then only the phrase "Hello World" appears on mouse over for every control in the grid, even if something else is specified. And it even seems to override the pager, header and footer tool tips as well, as no tool tips will appear at all for the pager, header and footer controls.

The other method, with which I am have equally dubious success, utilizes one of your examples where your instructions recommend placing a Rad ToolTip, rather than a rad ToolTipManager, directly inside the ItemTemplate tags, setting the TargetControlID and IsClientID properties for each. 

Like this:

<telerik:GridTemplateColumn ItemStyle-HorizontalAlign="Center" AllowFiltering="false" UniqueName="MyImage">
     <ItemTemplate>
          <asp:Image ID="imgMyImage" runat="server" />
          <telerik:RadToolTip TargetControlID="imgMyImage" IsClientID="true" runat="server"></telerik:RadToolTip>
     </ItemTemplate>
</telerik:GridTemplateColumn>

Or this:

<telerik:GridTemplateColumn ItemStyle-HorizontalAlign="Center" AllowFiltering="false" >
      <ItemTemplate>
           <asp:LinkButton ID="lbtnSomeButton" runat="server" CommandArgument='<%# Eval("ObjectID") %>'
           OnCommand="lbtnSomeButton_Command" Enabled='<%# Eval("SomethingEnabled") %>'
           meta:resourcekey="lbtnSomeButton">
               <asp:Image ID="imgSomeIcon" runat="server" ImageUrl="~/Images/SomeIcon.gif" Visible='<%#
               Eval("SomethingHasValue") %>'  />
           </asp:LinkButton>
          <telerik:RadToolTip ID="RadToolTip1" TargetControlID="imgSomeIcon" IsClientID="true" runat="server">
          </telerik:RadToolTip>
          <telerik:RadToolTip ID="RadToolTip2" TargetControlID="lbtnSomeButton" IsClientID="true" runat="server">
          </telerik:RadToolTip>
      </ItemTemplate>
</telerik:GridTemplateColumn>

(Note: I did not actually have both tool tips active at the same time as it appear above, but it is shown for demonstration purposes , to note each approach).

However with this approach, while the rest of the radGrid is 'ToolTipified' the image and link button control tooltips do NOT display. No tooltip shows at all. As you can see I have tried specifying both the link button itself and the image control as the TargetControlID to no avail.

How can I create a rad ToolTip for the image and/or linkbutton controls nested inside of the the ItemTemplate tags?

On a related note I have also noticed that when the RadToolTip control does successfully appear the asp tool tips are still appearing on mouse over. Is there a way to display only the rad toolTips?

Thank you in advance.

-Justin

[Marin Bratanov]

Hello Justin,

Straight to each case:
- with AutoTooltipify all HTML elements on the page that have a title/alt attribute will get a RadTooltip. Since the main wrapping element of the grid also has a title set, and it will be the last one to get the mouseover event when it bubbles, this behavior can be expected.

- with standalone tooltips - I would advise that you start by examining this demo, because the scenario is very similar: http://demos.telerik.com/aspnet-ajax/tooltip/examples/tooltipversustooltipmanager/defaultcs.aspx. I may assume that this is the demo you are using, but what is important is that the IsClientID is set to false (or rather, it is left to its default value which is false).

- RadToolTIp is an HTML/JavaScript/CSS structure and cannot directly affect the browser's tooltips. They are controlled by the presence of a title/alt attribute of the HTML element, so if you want certain elements to not have tooltips you need to make sure they do not have the title/alt attribute set (or set it to an empty string, some elements like images require it to pass validation). You may also find useful this article on controlling the content a RadToolTip shows: http://www.telerik.com/help/aspnet-ajax/tooltip-content.html.


Regards,
Marin Bratanov
Telerik