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

RadToolTipManager and RadToolBar

8 Answers 177 Views
ToolTip
This is a migrated thread and some comments may be shown as answers.
Stuart Hemming
Top achievements
Rank 2
Stuart Hemming asked on 20 Apr 2010, 02:53 PM
I want to use the LoD functionality of RadToolTipManager with a number of buttons defined in a RadToolBar.

Everything I've read suggests that I need to update the TargetControls collecton with the ID of the button. Now, I can't /set/ the ID of a ToolBarButton, but I can get at the ClientID of one, so, I'm doing this ...
RadToolBarButton btn = RadToolBar1.FindItemByValue("MoveFiles"as RadToolBarButton; 
RadToolTipManager1.TargetControls.Add(btn.ClientID, true); 

I have wired up the OnAjaxRequest event of the ToolTipManager but it never fires.

I can't figure out why.

Can anyone help?

--
Stuart

8 Answers, 1 is accepted

Sort by
0
robertw102
Top achievements
Rank 1
answered on 22 Apr 2010, 08:12 PM
Could we see your RadToolTipManager tag settings? I noticed you said your handling the RadToolTipManager's OnAjaxRequest event, although its called OnAjaxUpdate.
0
Accepted
Svetlina Anati
Telerik team
answered on 23 Apr 2010, 09:28 AM
Hi guys,

The RadToolBar's items does not actually have a default ID and thus this manner of tooltipifying will not work for this case. In order to achieve the desired result you should associate IDs on the server or create the tooltips on the client. Both the server and the client approaches are shown in the following demos:

http://demos.telerik.com/aspnet-ajax/tooltip/examples/tooltiptreeview/defaultcs.aspx
http://demos.telerik.com/aspnet-ajax/tooltip/examples/tooltipcalendar/defaultcs.aspx

The demos are not using a RadToolBar in particular but you should follow the same logic.


Kind regards,
Svetlina
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.
0
Stuart Hemming
Top achievements
Rank 2
answered on 23 Apr 2010, 03:06 PM
Hey Svetlina, long time no speak.

Thanks for that. I'm going to have a play with this, but, sadly, I'm using Q1 2009 still so some of the JS methods the examples you pointed me at don't exist!

--
Stuart
0
Stuart Hemming
Top achievements
Rank 2
answered on 23 Apr 2010, 03:12 PM
Svetlina,

Can I ask you to look at this SWF movie I've made of the code posted below in action?

This is the markup for the project...
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm3.aspx.cs" Inherits="WebApplication1.WebForm3" %> 
 
<%@ 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 runat="server"
    <title></title
</head> 
<body> 
    <form id="form1" runat="server"
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server"
    </telerik:RadScriptManager> 
 
    <telerik:RadToolBar ID="RadToolBar1" runat="server" Skin="Office2007" style="width:100%" OnItemCreated="RadToolBar1_ItemCreated"
        <Items> 
            <telerik:RadToolBarButton CommandName="undo" ImageUrl="Images/undo_16x16.png" /> 
            <telerik:RadToolBarButton CommandName="redo" ImageUrl="Images/redo_16x16.png" /> 
            <telerik:RadToolBarButton IsSeparator="true" /> 
            <telerik:RadToolBarButton CommandName="delete" ImageUrl="Images/delete_16x16.png" /> 
            <telerik:RadToolBarButton CommandName="cut" ImageUrl="Images/cut_16x16.png" /> 
            <telerik:RadToolBarButton CommandName="paste" ImageUrl="Images/paste_16x16.png" /> 
        </Items> 
    </telerik:RadToolBar> 
     
    <telerik:RadToolTipManager ID="RadToolTipManager1" runat="server" RelativeTo="BrowserWindow" Position="BottomRight" ShowCallout="false" Skin="WebBlue" Animation="Slide" OnAjaxUpdate="RadToolTipManager1_AjaxUpdate"
    </telerik:RadToolTipManager> 
     
    </form> 
</body> 
</html> 

And this is the code behind ...
using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.UI; 
using System.Web.UI.WebControls; 
using Telerik.Web.UI; 
 
namespace WebApplication1 
    public partial class WebForm3 : System.Web.UI.Page 
    { 
 
        protected override void OnLoad(EventArgs e) 
        { 
            base.OnLoad(e); 
            if (!IsPostBack) 
            { 
                foreach (RadToolBarItem i in RadToolBar1.Items) 
                { 
                    if (i is RadToolBarButton) 
                    { 
                        RadToolBarButton btn = i as RadToolBarButton; 
                        if (!String.IsNullOrEmpty(btn.CommandName)) 
                        { 
                            btn.Attributes["id"] = Guid.NewGuid().ToString(); 
                            btn.Value = String.Format("{0}:{1}", btn.CommandName, btn.Attributes["id"]); 
                            RadToolTipManager1.TargetControls.Add(btn.Attributes["id"], btn.Value, true); 
                        } 
                    } 
                } 
            } 
        } 
 
        protected void RadToolTipManager1_AjaxUpdate(object sender, ToolTipUpdateEventArgs e) 
        { 
            string[] args = e.Value.Split(new char[] {':'}); 
            Literal l = new Literal(); 
            l.Text = String.Format("Command: <strong>{0}</strong><br/>ID: <strong>{1}</strong>", args[0], args[1]); 
            e.UpdatePanel.ContentTemplateContainer.Controls.Add(l); 
        } 
    } 
 

If you watch he movie, you'll see that as the tooltips are repeatedly shown, they move rightward across the page until the have to start wrapping to on.

What's going on here?

BTW, this project uses Q1 2009 controls.

--
Stuart


0
Stuart Hemming
Top achievements
Rank 2
answered on 25 Apr 2010, 01:22 PM
I forgot to say...

It's not too obvious in the small browser window I used for the movie, but the code clearly defines that the tooltip should appear in the lower-right corner of the browser, when it appears, in fact, in the lower-left.

-- 
Stuart
0
Accepted
Svetlina Anati
Telerik team
answered on 28 Apr 2010, 03:33 PM
Hello Stuart,

I tested the code you provided and I reproduced similar issue to the one shown on the video capture and the reason for this behavior is that  there is not explicit width set and the OnAjaxUpdate event is used. This is expected behavior in such case with the current implememtation of the tooltip - the content of the tooltip is loaded through AJAX and the tooltip cannot "predict" the width it has to have when it is shown. Thus it shows at some coordinates and after that the resize takes place and as a result the position is not the correct.

This being said, you should set the Width property explicitly and to use the ContentScrolling property to the desired value in order to determine the behavior when the width should be bigger than the set. If you want the tooltip to resize accordingly you should set it to Default.

We are currently working on improving this behavior but for the time being some explicit size set is the best solution for the case.


Regards,
Svetlina
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.
0
Stuart Hemming
Top achievements
Rank 2
answered on 03 May 2010, 10:39 PM
Svetlina,

Thanks for that. I've tried your suggestion on my Q1 2010 version and it works as expected. I'll try it with the Q1 2009 code tomorrow.

-- 
Stuart
0
Svetlina Anati
Telerik team
answered on 04 May 2010, 02:59 PM
Hello Stuart,

I am glad to hear that my reply was helpful! In case you need further assistance or additional questions, do not hesitate to contact me again, I will be happy to assist!


Best wishes,
Svetlina
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.
Tags
ToolTip
Asked by
Stuart Hemming
Top achievements
Rank 2
Answers by
robertw102
Top achievements
Rank 1
Svetlina Anati
Telerik team
Stuart Hemming
Top achievements
Rank 2
Share this question
or