Tooltip for dropdownbox/RadToopTip in Firefox?

3 posts, 0 answers
  1. Joel
    Joel avatar
    185 posts
    Member since:
    Oct 2006

    Posted 22 Dec 2009 Link to this post

    When using formdecorator, it seems to turn tooltips off for dropdown boxes and RadToolTip in Firefox and Chrome? RadToolTip works fine in IE, but not the dropdownbox tooltip.  If I comment out the formdecorator tag below, both tooltips show up fine in all 3 browsers.

    Builtin Tooltips are working fine on the same page with RadNumericTextbox which is even more strange

    Any ideas?



    <%@ Page Language="VB" AutoEventWireup="false" CodeFile="test.aspx.vb" Inherits="test" %> 
    <%@ 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>Untitled Page</title> 
    </head> 
    <body> 
        <form id="form1" runat="server"> 
        <div> 
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" /> 
    <telerik:RadFormDecorator DecoratedControls="All" runat="server" Skin="Forest" /> 
         
     <telerik:RadToolTip ID="RadToolTip1" runat="server" Width="150" AutoCloseDelay="10000" TargetControlID="DropDownList1" Position="MiddleRight" OffsetY="0" OffsetX="10" ShowDelay="300"   Text="Required: Something something something." >   </telerik:RadToolTip> 
         <asp:DropDownList ID="DropDownList1" runat="server" CausesValidation="true"  Font-Size="7" Width="120"  ToolTip="Required: Something something something." > 
            <asp:ListItem Text="Match Degree" Value="-1"></asp:ListItem> 
            <asp:ListItem Text="Match" Value="0"></asp:ListItem> 
            <asp:ListItem Text="Minus" Value="1"></asp:ListItem> 
            <asp:ListItem Text="Plus" Value="2"></asp:ListItem> 
        </asp:DropDownList> 
        </div> 
        </form> 
    </body> 
    </html> 

  3. Joel
    Joel avatar
    185 posts
    Member since:
    Oct 2006

    Posted 22 Dec 2009 Link to this post

    Original post is still true.  Additional related problem I would like to document is this:

    If you take the dropdown list and put it in a tablecell, it still works as previous post documents.

    If you load the page with the table visible=false, then postback to visible=true, neither tooltip works in any of the 3 browsers for dropdownlist or radtooltip.  RadNumericTextbox and RadTextbox both work with the builtin tooltip in this scenario.

    I just tried something else, and I can't get radtooltip to work with RadNumericTextbox at all in any browser

    My version is 2009.3.1103.35

    Update:  Upgraded to 1221 and all problems persist as defined.
  5. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 25 Dec 2009 Link to this post

    Hello Joel,

    Let me explain in brief how the RadFormDecorator decorates dropdownlists. It positions the real dropdown outside the visible viewport (e.g sets left to be -99999)  in order to hide it and puts the skinned element instead on the palace of the original dropdown. However, the skinned dropdown gets another ID which is formed by the original ID and the prefix "Skinned" because the original dropdown should keep the original ID in order to handle the events. The scenario with the tooltip is a specific one because you need to set the tooltip the ID of the hovered element to show it. Since in IE and FF the speed of decorating, initializing, etc is different you get the different result. We are aware of this problem and it will be soon fixed. For the time being, I suggest to set the skinned ID along with isClientID - this should fix the problem under all browsers:

    <form id="form1" runat="server">
            <div>
                <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
                <telerik:RadFormDecorator ID="RadFormDecorator1" DecoratedControls="All" runat="server"
                    Skin="Forest" />
                <asp:DropDownList ID="DropDownList1" runat="server" CausesValidation="true" Font-Size="7"
                    Width="120" ToolTip="Required: Something something something.">
                    <asp:ListItem Text="Match Degree" Value="-1"></asp:ListItem>
                    <asp:ListItem Text="Match" Value="0"></asp:ListItem>
                    <asp:ListItem Text="Minus" Value="1"></asp:ListItem>
                    <asp:ListItem Text="Plus" Value="2"></asp:ListItem>
                </asp:DropDownList>
                <telerik:RadToolTip ID="RadToolTip1" runat="server" Width="150" AutoCloseDelay="10000"
                    TargetControlID="SkinnedDropDownList1" IsClientID="true" Position="MiddleRight"
                    OffsetY="0" OffsetX="10" ShowDelay="300" Text="Required: Something something something.">
                </telerik:RadToolTip>
            </div>
        </form>

    As to the RadInput controls, there was a similar problem there because the clientID of the element which should be tooltipified is different than the server ID. However, this problem is fixed and it should work out of the box. In case you continue experiencing problems with integration of RadToolTip and RadInput, please send me some relevant code and I will do my best to help.

    All the best,
    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.
Back to Top