How to close tooltip from code when initiated through RadTooltipManager

5 posts, 0 answers
  1. Henrik Brinch
    Henrik Brinch avatar
    100 posts
    Member since:
    Aug 2004

    Posted 28 Apr 2008 Link to this post

    Can anybody help me witht the following problem:

    I have a RadTooltipManager where I dynamically on AjaxUpdate load the content of the tooltip (actually just a user control).

    Now from within the tooltip content (that is the user control) I need a way, e.g. a button that will close the tooltip.

    Is that possible?  If yes... how?  I don't see any Client site documentation for the RadTooltipManager :(
  2. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 30 Apr 2008 Link to this post

    Hi Henrik Brinch,

    When you use RadToolTipManager you actually create RadToolTips and you can use the RadToolTip's client-side API.

    I suggest writing a javascript function, which gets a reference to the active tooltip and then hides it. This function should look like the following one:

     function CloseActiveToolTip()  
            {   
                setTimeout(function(){   
                    var controller = Telerik.Web.UI.RadToolTipController.getInstance();  
                    var tooltip = controller.get_activeToolTip();  
                    if (tooltip) tooltip.hide();  
                }, 1000);  
            }  
     

    You can execute this function from server-side in a standard manner - e.g. inject script through a label, use the ClientScript.RegisterStartupScript method, RadAjaxManager's ResponseScripts collection, etc.  


    Best wishes,
    Svetlina
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Sharbel Lutfallah
    Sharbel Lutfallah avatar
    26 posts
    Member since:
    Feb 2006

    Posted 16 May 2008 Link to this post

    Hi there,

    I thought i should add to this to save others the same trouble i went through when the script does not fire.  Consider the following scenario:

    1) I created a usercontrol that holds a RadToolTipManager that acts as a wrapper for a custom confirm dialog

    2) on AjaxUpdate, i dynamically add to the tipmanager's UpdatePanel ContentContainer, and set some configuration settings before showing the tooltip.

    3) User clicks the Confirm button which is an ImageButton inside the UpdatePanel that exists in the ToolTipManger's tooltip.

    4) A custom event that I created for the usercontrol gets called and is bubbled to the calling page...

    5) Event does its thing and then I want to execute the Page.RegisterStartupScript to close the tooltip.  This will not work because we are in an UpdatePanel (the update panel that exists in the TooltipManager)

    So, to fix this, you must register your clientside script like this:

    ScriptManager.RegisterStartupScript(this.Page, this.GetType(), Guid.NewGuid().ToString(), "CloseTooltip();", true);

    Hope this helps!

  5. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 17 May 2008 Link to this post

    Hello Sharbel,

    Yes, this is the correct approach in such case but this depends on the exact scenario - you can also examine this demo which uses exactly the same approach.



    Greetings,
    Svetlina
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  6. bemara57
    bemara57 avatar
    57 posts
    Member since:
    Mar 2008

    Posted 24 Jun 2008 Link to this post

    Svetlina, excellent Javascript code! I adjusted it so it can be used on pages without knowing if there are even any Tooltips on the page beforehand (dynamically created pages). Now this can be used as a global function.

    function CloseActiveToolTip() 
    {  
        setTimeout(function(){
            if (Telerik.Web.UI.RadToolTipController)
            { 
                var controller = Telerik.Web.UI.RadToolTipController.getInstance(); 
                var tooltip = controller.get_activeToolTip(); 
                if (tooltip) tooltip.hide(); 
            }
        }, 200); 
    }

    This ensures the Tooltip is on the page first, rather than throwing an error if it isn't. Also, I integrated this in my RadWindow alerts so when a radalert pops up, it closes the active tooltip. Without it, the alert and the dim screen shows up BEHIND the tooltip, defeating the purpose of page alerts.
               
                var oldAlert = radalert;
                window.radalert = function(text, oWidth, oHeight, oTitle)  
                {           
                    oldAlert(text, oWidth, oHeight, oTitle);
                    CloseActiveToolTip();
                }
                           
                var oldConfirm = radconfirm;
                window.radconfirm= function(text, callBackFn, oWidth, oHeight, callerObj, oTitle)  
                {           
                    oldConfirm(text, callBackFn, oWidth, oHeight, callerObj, oTitle);
                    CloseActiveToolTip();
                }

                var oldPrompt = radprompt;
                window.radprompt = function(text, callBackFn, oWidth, oHeight, callerObj, oTitle, defaultValue)  
                {           
                    oldPrompt(text, callBackFn, oWidth, oHeight, callerObj, oTitle, defaultValue);
                    CloseActiveToolTip();
                }

    I hope this helps.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017