1-888-365-2779
+1-888-365-2779
Try Now
More in this section

Forums / General Discussions / RadControls ToolTip Template

RadControls ToolTip Template

6 posts, 0 answered
  1. Jason Heine
    Jason Heine avatar
    3 posts
    Registered:
    08 Apr 2010
    17 Jan 2011
    Link to this post
    Hello Community,

    I was looking to add a RadControls tooltip to a couple of my home page images. Now, I was able to get the tool tip to show up, not a problem.

    My question is, how do I get a template to show up in the tool tip? I need html code, with images, to show in the tool tip. 

    Is this even possible in sitefinity or would you recommend a different approach to this.

    Thanks,

    Jason
  2. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    19 Jan 2011
    Link to this post
    Hi Jason,

    You can use the modality option of the RadToolTip.

    Kind regards,
    Ivan Dimitrov
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Jason Heine
    Jason Heine avatar
    3 posts
    Registered:
    08 Apr 2010
    19 Jan 2011
    Link to this post
    How does this help me in sitefinity?

    I don't want it to be modal, i just want a normal html tool tip like you can do with your RadTool tip in a regular asp.net application.
  4. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    19 Jan 2011
    Link to this post
    Hi Jason ,

    There is not difference if you are going to use RadToolTip in Sitefinity or inside another application.
    You can use RadToolTipManager and its OnAjaxUpdate event  to load a control in the tool tip.

    You can check the demos for RadToolTip  to see how the control can be used. If you like one of the demos, please get back to me and I will show you how to implement it in Sitefinity.

    All the best,
    Ivan Dimitrov
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  5. Jason Heine
    Jason Heine avatar
    3 posts
    Registered:
    08 Apr 2010
    19 Jan 2011
    Link to this post
    Okay yes, that would be great. We are using SiteFinity 4.0 and I have not been able to find any resources to implement the RadToolTipManager on my page.

    Just the basic default example is what we are looking to do:
    http://demos.telerik.com/aspnet-ajax/tooltip/examples/default/defaultcs.aspx

    We are going to have some main images on the site and when you mouse over one of the images, it will load a sub page that contains menu links with images to different parts of the site.

    Thanks
  6. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    02 Feb 2011
    Link to this post
    Hi Jason,


    Here is a sample control

    <telerik:RadToolTipManager runat="server" AnimationDuration="300" ShowDelay="200"
               EnableShadow="true" HideDelay="1" ID="RadToolTipManager1" Width="453px" Height="210px"
               RelativeTo="Element" Animation="Slide" Position="BottomCenter" OnAjaxUpdate="OnAjaxUpdate"
               Skin="Telerik" />
           <asp:Repeater runat="server" ID="Repeater1">
               <ItemTemplate>
                   <div style="border: 1px solid #999999; float: left; margin: 3px; width: 125px; height: 125px;">
                   <asp:Image runat="server" ID="Image1" />
                       <div runat="server" id="smallImage" style="width: 125px; height: 125px; background-position: center;
                           background-repeat: no-repeat;">
                       </div>
                   </div>
               </ItemTemplate>
           </asp:Repeater>

    code behind

    public partial class RadToolTip : System.Web.UI.UserControl
       {
     
           protected void OnAjaxUpdate(object sender, ToolTipUpdateEventArgs args)
           {
               this.UpdateToolTip(args.Value, args.UpdatePanel);
           }
           private void UpdateToolTip(string elementID, UpdatePanel panel)
           {
               // pass the elementId to a control which you want to show the image.
           }
     
           protected void Page_Load(object sender, EventArgs e)
           {
     
               var ds = App.WorkWith().Images().Get().ToList();
               Repeater1.DataSource = ds;
               Repeater1.ItemDataBound += new RepeaterItemEventHandler(Repeater1_ItemDataBound);
               Repeater1.DataBind();
           }
     
           void Repeater1_ItemDataBound(object sender, RepeaterItemEventArgs e)
           {
               if (e.Item.ItemType == ListItemType.AlternatingItem || e.Item.ItemType == ListItemType.AlternatingItem)
               {
                   var item = e.Item.DataItem as Telerik.Sitefinity.Libraries.Model.Image;
                   var img = e.Item.FindControl("Image1") as Image;
                   img.ImageUrl = item.MediaUrl;
                   this.RadToolTipManager1.TargetControls.Add(img.ClientID, item.MediaUrl, true);
               }
           }
       }


    Regards,
    Ivan Dimitrov
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
6 posts, 0 answered