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

Toogle tooltip with onclick

7 Answers 289 Views
ToolTip
This is a migrated thread and some comments may be shown as answers.
Victor
Top achievements
Rank 1
Victor asked on 15 Sep 2008, 06:51 PM
Is it possible to show/hide the tooltip with the onclick event of the tagetcontrolid?

7 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 16 Sep 2008, 09:19 AM
Hi Victor,

I am not sure whether I understood the question correctly. Give a try with the following code snippet and see if it is helpful.

ASPX:
<asp:Button ID="Button1" runat="server" Text="Click" OnClick="Button1_Click" /> 
   
        <telerik:RadToolTip ID="RadToolTip1"   Text="MyToolTip" TargetControlID="Button1" runat="server"
        </telerik:RadToolTip> 

CS:
protected void Button1_Click(object sender, EventArgs e) 
    { 
        RadToolTip1.Visible = !RadToolTip1.Visible; 
    } 


Thanks
Shinu.

0
Victor
Top achievements
Rank 1
answered on 16 Sep 2008, 03:15 PM
The OnClick event never fires.
0
Tervel
Telerik team
answered on 16 Sep 2008, 03:21 PM
Hello Victor,


I suggest using the RadToolTip's property ShowEvent = "OnClick"

All the best,
Tervel
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Victor
Top achievements
Rank 1
answered on 16 Sep 2008, 03:28 PM
Yes this works to show the tip, but not to toggle it.

What I am trying to do is, if the tooltip is hidden and you click on a link (the targetcontrolid) the tip shows. If the tooltip is showing and you click on the link the tip hides.
0
Shinu
Top achievements
Rank 2
answered on 17 Sep 2008, 07:15 AM
Hi Victor,

Could you please send your aspx?

Shinu.
0
Victor
Top achievements
Rank 1
answered on 17 Sep 2008, 02:21 PM
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="ArtistMenu.ascx.cs" Inherits="usercontrols_ArtistMenu" %> 
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %> 
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> 
<asp:LinkButton ID="hlArtistName" runat="server" CssClass="ArtistMenu" OnClick="LinkButton_Click" /> 
<telerik:RadToolTip ID="radArtistMenu" runat="server" Width="200" TargetControlID="hlArtistName" ShowCallout="false" ShowEvent="onclick" Sticky="true" Animation="fade" ManualClose="true" RelativeTo="element" Skin="Default" Position="BottomRight"
    <asp:Panel runat="server" ID="pnlArtist" CssClass="ArtistMenuItemFirst"
        <asp:Image runat="server" ID="radMenuArtistIcon" Width="20" /><asp:HyperLink runat="server" ID="radMenuArtist" /> 
    </asp:Panel> 
    <asp:Panel runat="server" ID="pnlAddToFavorites" CssClass="ArtistMenuItem"
        <asp:Image runat="server" ID="imgAddToFavorites" ImageUrl="/images/community/17x17-AddFavArtist.png" /><asp:HyperLink runat="server" ID="radMenuAddToFavorites" Text="Add to Favorite Artists" /> 
    </asp:Panel> 
    <asp:Panel runat="server" ID="pnlSendAMessage" CssClass="ArtistMenuItem"
        <asp:Image runat="server" ID="imgSendAMessage" ImageUrl="/images/community/16x16-SendMessage.png" /><asp:HyperLink runat="server" ID="radMenuSendAMessage" Text="Send a Message" /> 
    </asp:Panel> 
    <asp:Panel runat="server" ID="pnlSeeGalleries" CssClass="ArtistMenuItem"
        <asp:Image runat="server" ID="imgSeeGalleries" ImageUrl="/images/community/16x16-SeeGalleries.png" /><asp:HyperLink runat="server" ID="radMenuSeeGalleries" Text="See Galleries" /> 
    </asp:Panel> 
    <asp:Panel runat="server" ID="pnlInviteToAGroup" CssClass="ArtistMenuItem"
        <asp:Image runat="server" ID="imgInviteToAGroup" ImageUrl="/images/community/16x16-InviteToGroup.png" /><asp:HyperLink runat="server" ID="radMenuInviteToAGroup" Text="Invite to a Group" /> 
    </asp:Panel> 
</telerik:RadToolTip> 
 

0
Svetlina Anati
Telerik team
answered on 19 Sep 2008, 08:46 AM
Hi Victor,

You can achieve the desired behavior by using some javascript code - you can declare a global boolean variable and switch its value. Based on the variable's value you can determine whether to show the tooltip or not in the tooltip's OnClientBeforeShow handler as shown below:

  <script type="text/javascript">  
        var toShow = true;  
        function OnClientBeforeShow(sender, args)  
        {  
            if(!toShow)  
            {  
               args.set_cancel(true);  
            }  
            toShow = !toShow;  
             
        }  
        </script> 
        <asp:LinkButton ID="hlArtistName" runat="server" CssClass="ArtistMenu" Text="Target control" /> 
        <telerik:RadToolTip ID="radArtistMenu" runat="server" Width="200" TargetControlID="hlArtistName" 
            ShowCallout="false" ShowEvent="onclick" Sticky="true" Animation="fade" ManualClose="true" 
            RelativeTo="element" Skin="Default" Position="BottomRight" OnClientBeforeShow="OnClientBeforeShow">  
            <asp:Panel runat="server" ID="pnlArtist" CssClass="ArtistMenuItemFirst"

For your convenience I attached the sample page.

All the best,
Svetlina
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
ToolTip
Asked by
Victor
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
Victor
Top achievements
Rank 1
Tervel
Telerik team
Svetlina Anati
Telerik team
Share this question
or