ToolTip w/ Dock Scrolling Problem

2 posts, 0 answers
  1. Oleg Fridman
    Oleg Fridman avatar
    77 posts
    Member since:
    Jan 2006

    Posted 01 Oct 2007 Link to this post

    Hello,

    It does not seem that the ToolTip and the Dock want to play well together. When I set the RadToolTipManager.ContentScrolling="Y" and put a Dock in the tooltip, I get the following:

    Before Scrolling Down:
    http://www.owebtech.com/error1.jpg

    After Scrolling Down:
    http://www.owebtech.com/error2.jpg

    My understanding is that enabling the scroll bar should limit the height of the ToolTip to whatever I set it to (300px in this case) and scroll for the remaining content. However, this tooltip seems to have been extended to meet the maximum required height and the Dock does not seem to be scrolling with the rest of the page.

    Thoughts as to how I can avoid this and make it look normal?

    Thank you,
    Oleg Fridman
  2.
  3. Petio Petkov
    Admin
    Petio Petkov avatar
    825 posts

    Posted 05 Oct 2007 Link to this post


    Hello Oleg,

    Please take a look at the following code, where the RadDock is in a RadDockZone within RadToolTIp, and include it in your project. All you need to do is to add the OnClientShow handler to the RadTooltip OnClientShow event:

    <%@ Register TagPrefix="rad" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> 
    <!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 id="Head1" runat="server">  
        <title>Untitled Page</title> 
        <script type="text/javascript">    
        function OnClientShow(obj,args)  
        {  
         var tooltipElement = obj.get_ContentElement();  
         Telerik.Web.UI.CallRadShow(tooltipElement);  
         tooltipElement.style.position = "relative";  
        }  
        </script> 
    </head> 
    <body> 
        <form id="form1" runat="server">      
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> 
        <div> 
        <rad:RadDockLayout ID="RadDockLayout1" runat="server">  
        <asp:Button ID="Button1" runat="server" Text="ComeToMe!"/>  
        <rad:RadToolTip ID="RadTooltip1" runat="server" TargetControlID="Button1"   
        ContentScrolling="Y" AutoCloseDelay="1000" ManualClose="true" 
         OnClientShow="OnClientShow" 
        Width="500px" Height="300px">         
         <rad:RadDockZone ID="RadDockZone2" runat="server" Height="600px" Width="400px" > 
                <rad:RadDock ID="RadDock6" runat="server" Text="MyDock"></rad:RadDock> 
                <rad:RadDock ID="RadDock7" runat="server" Text="MyDock"></rad:RadDock> 
                <rad:RadDock ID="RadDock8" runat="server" Text="MyDock"></rad:RadDock> 
                <rad:RadDock ID="RadDock9" runat="server" Text="MyDock"></rad:RadDock> 
                <rad:RadDock ID="RadDock10" runat="server" Text="MyDock"></rad:RadDock> 
           </rad:RadDockZone> 
        </rad:RadToolTip>     
        </rad:RadDockLayout> 
        </div> 
        </form> 
    </body> 
    </html> 
     

    As a general guideline, you should have in mind that the RadDock control is designed to be used for creating page layouts.

    Kind regards,
    Petio Petkov
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
Back to Top