This is a migrated thread and some comments may be shown as answers.

Configure radDoc to work with TooltipManager

6 Answers 105 Views
Dock
This is a migrated thread and some comments may be shown as answers.
Kian Cha
Top achievements
Rank 1
Kian Cha asked on 03 Jan 2008, 05:22 PM
When I add radTooltipManager to the page, radDock control displays two "Collapse" tooltip, one for TooltipManager and one for the RadDock control.

How do I configure radDock control to only show tooltip from tooltip Manager?

Thx.

Kian

6 Answers, 1 is accepted

Sort by
0
Petya
Telerik team
answered on 04 Jan 2008, 04:21 PM
Hi Kian Cha,

This is a problem we are aware of and have logged it in our TODO list. For now the only workaround we can offer you is the following:

        <asp:scriptmanager id="ScriptManager" runat="server"
        </asp:scriptmanager> 
        <telerik:radtooltipmanager runat="server" id="RadTooltipManager1" /> 
 
            <telerik:raddocklayout id="RadDockLayout1" runat="server"
                <telerik:raddockzone id="RadDockZone1" runat="server" minheight="300px" orientation="Vertical" 
                    style="float: left; margin-right: 20px;" width="200px"
                    <telerik:raddock onclientinitialize="OnClientInitialize" id="RadDock1" runat="server" text="RadDock 1" title="RadDock 1" 
                        width="200px"
                    </telerik:raddock> 
                </telerik:raddockzone> 
            </telerik:raddocklayout> 
         
        <script type="text/javascript"
        function OnClientInitialize(dock) 
        { 
            dock.getCommand("ExpandCollapse").get_element().removeAttribute("title"); 
        } 
        </script> 

Hope this helps.

Regards,
Petya
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
0
Kian Cha
Top achievements
Rank 1
answered on 09 Jan 2008, 06:59 PM
Hi,

With the new sample code you've provided, I am still getting 2 tooltips. This is what I am seeing...

When the dock control is expanded:
RadDock tooltip = "collapse"
TooltipManger tooltip = "collapse"

When the dock control is collapsed:
RadDock tooltip = "expand"
TooltipManger tooltip = "collapse"

Any ideas?

Thanks.

Kian
0
Sophy
Telerik team
answered on 15 Jan 2008, 04:25 PM
Hi,

RadDock control's command ExpandCollapse has a title which the browser uses to show a tooltip. RadDock changes this title every time command's state is changed, e.g. it is expanded or collapsed. The RadToolTipManager also uses element's title to show a tooltip. The main idea to hide RadDock's default tooltip is to find the title of the corresponding element, to give it to the tooltip and then remove the title so that the browser does not display it. However, there is no proper event which happens early enough so that you can handle it and do the above described procedure. The browser finds the dock command's title earlier and shows the tooltip. That is why, RadDock's default tooltip will always be shown the first time. To stop RadDock's default tooltip showing after the first time the best event we can suggest using is OnClientBeforeShow event of the RadToolTipManager. The code below demonstrates our suggestion:

<html xmlns="http://www.w3.org/1999/xhtml">  
<head runat="server">  
    <title>Untitled Page</title> 
</head> 
<body> 
    <form id="form1" runat="server">  
        <asp:scriptmanager id="ScriptManager" runat="server">  
        </asp:scriptmanager> 
        <script type="text/jscript">        
        function onClientBeforeShowHandler(sender, args)  
        {  
            var dock = $find("<%=RadDock1.ClientID %>");  
            var elem = dock.getCommand("ExpandCollapse").get_element();  
              
            var title = elem.getAttribute("title");    
            if (!title) return;  
              
            var div = document.createElement("DIV");  
                          
            div.innerHTML = title;              
            elem.removeAttribute("title");                
            sender.set_contentElement(div);  
        }   
        </script> 
        <telerik:radtooltipmanager id="Manager1" onclientbeforeshow="onClientBeforeShowHandler"runat="server" /> 
        <telerik:raddocklayout id="RadDockLayout1" runat="server">  
            <telerik:raddockzone id="RadDockZone1" runat="server" minheight="300px" orientation="Vertical" 
                style="float: left; margin-right: 20px;" width="200px">  
                <telerik:raddock id="RadDock1" runat="server" text="RadDock 1" title="RadDock 1" width="200px">  
                </telerik:raddock> 
            </telerik:raddockzone> 
        </telerik:raddocklayout> 
    </form> 
</body> 
</html> 

Please, note that the provided code does not completely solve the problem and the first time you will continue observing the two tooltips. However, this is the only workaround we can suggest you for the moment. The problem is due to the way the two controls interact together and as we mentioned in our previous reply we have logged the issue in our TODO list.

If you have other question do not hesitate to contact us again.

Best wishes,
Sophy
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
0
Glenn
Top achievements
Rank 1
answered on 13 May 2009, 07:28 PM
I am working on what I think is the same problem in the latest build.  My controls show two tooltips (one from the TooltipManager and one from the RadDock I think) and they are correct.  And then when I collapse one that was expanded on load the TooltipManager one (the prettier looking graphical one) will continue to say "collapse" and the simpler text box one will update and be correct... now showing "expand".

In my situation I have 1 TooltipManager, 2 DynamicRadDockZones (two columns essentially)  and I think this may make the code workaround you propose not apply to me.  When I add the OnClientBeforeShow="onClientBeforeShowHandler" to the RadTooltipManager it seems that my client side script isn't called.
0
Obi-Wan Kenobi
Top achievements
Rank 1
answered on 14 May 2009, 12:29 PM
I managed to create a working code which handles OnCLientBeforeShow event,e.g.
<%@ 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 > 
    <title></title>  
</head> 
<body> 
    <form id="form1" runat="server">  
    <script type="text/javascript">  
        function TooltipBeforeShowHandler(sender, args) {  
 
            var newTitle = sender.get_targetControl().title;  
            if (newTitle) {  
                sender.set_text(newTitle);  
            }  
              
        }      
    </script>    
        
    <asp:ScriptManager ID="ScriptManagerr1" runat="server"></asp:ScriptManager> 
    <telerik:RadToolTipManager ID="RadTooltipManager1" runat="server"   
    AutoTooltipify="true" OnClientBeforeShow="TooltipBeforeShowHandler">  
    </telerik:RadToolTipManager> 
    <telerik:RadDockLayout ID="RadDockLayout1" runat="server">  
      
        <telerik:RadDockZone ID="RadDockZone1" runat="server" Width="300px">  
            <telerik:RadDock ID="RadDock1" runat="server" Title="RadDock1">  
                <ContentTemplate> 
                    a  
                </ContentTemplate> 
            </telerik:RadDock> 
            <telerik:RadDock ID="RadDock2" runat="server" Title="RadDock2">  
                <ContentTemplate> 
                    b  
                </ContentTemplate> 
            </telerik:RadDock> 
        </telerik:RadDockZone> 
    </telerik:RadDockLayout> 
    </form> 
</body> 
</html> 
0
Glenn
Top achievements
Rank 1
answered on 14 May 2009, 04:02 PM
That is concise and works great.  Thanks very much Obi-Wan!
Tags
Dock
Asked by
Kian Cha
Top achievements
Rank 1
Answers by
Petya
Telerik team
Kian Cha
Top achievements
Rank 1
Sophy
Telerik team
Glenn
Top achievements
Rank 1
Obi-Wan Kenobi
Top achievements
Rank 1
Share this question
or