Server-side Tooltip Close?

[Alex Peachey]

I've been loving the new ToolTip and using it quite a bit in the current project I am building. One thing I like is that you can use the tooltip to provide simple information/tasks without using valuable screen realestate. I use a number of tooltips tied to controls that open with the OnClick trigger. I then set it sticky with manual close and then can put a couple of interactive controls in it.

If the page uses postbacks (no Ajax) then I've noticed you can use the controls in my pop-up and when you post back, it performs the logic, the page refreshes, and the pop-up is closed. If I use Ajax however to make it nicer user experience, it performs the logic without a full postback/refresh and of course the tooltip stays open as I would expect. The problem is, often I want the tooltip to close after an action.

I haven't found a good way to force a tooltip closed from the serverside.

Is there one? If not, can it be added in the next SP?

Thanks,

Alex

[Tsvetie]

Hi Alex,
In order to close the RadToolTip, all you need to do is execute a javascript function that calls the hide method of the object after the Ajax request finishes. For example, if you are using RadAjax:

    <form id="form1" runat="server">
        <script type="text/javascript">
        function CloseToolTip()
        {
            var toolTip = $find('RadToolTip1');
            toolTip.hide();
        }
        </script>
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <asp:Label ID="Label1" runat="server" Text="Label" ToolTip="AAAAAAAAAA"></asp:Label>
        <telerik:RadToolTip ID="RadToolTip1" runat="server"
            TargetControlID="Label1"
            Sticky="true"
            ManualClose="true">
        </telerik:RadToolTip>

        <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
        <asp:Panel ID="Panel1" runat="server" Height="50px" Width="125px">
        </asp:Panel>

        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="Button1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="Panel1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
    </form>

code-behind:

    protected void Button1_Click(object sender, EventArgs e)
    {
        this.RadAjaxManager1.ResponseScripts.Add("CloseToolTip();");
    }

I case you are using a RadToolTipManager (with OnAjaxUpdate) with Ajax, I recommend that you open a new support thread so that we can send you the latest hotfix that solves some problems that we have found in this particular combination of controls. 

Sincerely yours,
Tsvetie
the Telerik team

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

[genesplitter]

Do you have an example for closing the tooltip from code-behind when using a ToolTipManager and UserControl in a project similar to your Scheduler / Tooltip example:

http://www.telerik.com/DEMOS/ASPNET/Prometheus/Scheduler/Examples/RadToolTip/DefaultCS.aspx

My usercontrol is a form to collect information with a submit button. After the submit button is clicked, form data is saved and the tooltip should close. My problem is that since my tooltip content is a usercontrol and the tooltipmanager is in the containing aspx page, I cannot get a reference to RadToolTipManager1 from the usercontrol codebehind.

[Georgi Tunev]

Hi Donald,

We don't have such example because such task is not directly related to the RadToolTIp control, but is a general one.
More information on how to reference a control in a MasterPage from within a content page is available in the MSDN. I hope the following link will be of help:
http://msdn2.microsoft.com/EN-US/library/xxwa0ff0.aspx



Kind regards,
Georgi Tunev
the Telerik team

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

[Timo Saikkonen]

Hi,

I'm battling with a similiar case. I have a RadToolTip control in a usercontrol that occurs multiple times on a content page. I need to show and hide the tooltip from the code behind. The provided solution is all well and good, except that the $find function takes the server side id as a parameter, doesn't it?

Another question: I have a user control inside the tooltip that needs to do some postbacks before the tooltip closes, and I have the control enclosed within an radajaxpanel. However, when the control posts back, it triggers the loading panel in the tooltip AND in the containing page. I only want it in the tooltip. How would I tackle this?

I imagine that we're not alone in this with Alex, so I'd suggest you implement server side Show() and Hide() methods to provide a bit cleaner ways to trigger the tooltips.

ps. this relates to a blog post of mine that Georgi Tunev commented on at http://timosaikkonen.blogspot.com

[Tsvetie]

Hello tsaikkonen,
Actually, the $find function takes the clientID of the control as parameter. That is why, you should not have problems using the suggested approach. However, there is a simpler way to get the currently visible tooltip:

<script type="text/javascript">
function CloseToolTip()
{
    var controller = Telerik.Web.UI.RadToolTipController.getInstance();
    var tooltip = controller.get_ActiveToolTip();
    if(tooltip) tooltip.hide();
}
</script>

I have attached a simple test project based on the provided information to demonstrate how you can get the desired result.

I am not quite sure what the problem with the RadAjaxLoadingPanels is. In case you could provide us with a simple running project, demonstrating it, we will do our best to find what is causing it. However, in such cases as the one you describe, I believe the RadToolTipManager will help you get the desired result easier. Basically all you need to do is add the ClientIDs of the controls you need tooltipified to the TargetControls collection of the manager and use its AjaxUpdate event. The RadToolTipManager creates the tooltips on demand and places their content in UpdatePanels. Please refer to our online examples for a basic overview of the functionality the RadToolTipManager provides.

Regarding your suggestion for Show and Hide server methods - I added it to our TODO list and updated your Telerik points.

Sincerely yours,
Tsvetie
the Telerik team

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