Use the existing html markup in the page as tooltip

[Tigger Tag]

Hi,

I have a grid in the RadAjaxPanel, which has a column with a asp button. Also, the same column has display none div with all the html need for tooltip. I want to use this div as tooltip when the user mouse over this button. Also, this div has links that are clickable. So, how do I use RadToolTipManager or RadToolTip to show the tool tip. Any help is greatly appreciated.

Thanks,
Ana

[Tigger Tag]

This is what I so far.
In the radgrid ItemDataBound I am adding the button as TargetControls list. I am sending the ClientId of the Div (which has tooltip html markup for this row) as value

    

HtmlGenericControl divControl = dataItem.FindControl("_attachmentDiv") as HtmlGenericControl;                      this.TooltipManger.TargetControls.Add(downloadButton.ClientID, divControl.ClientID, true);

On aspx file:

<telerik:RadToolTipManager ID="TooltipManger" runat="server" OnClientShow="createContent">      </telerik:RadToolTipManager>

On javascript code:

    

function createContent(sender, args) {
         var dataKeys = sender.get_value(); // I am getting the ClientID of the div which need to be shown
//What should I do now to actually show the content of the Div associated with the dataKeys as tooltip
}

[Marin Bratanov]

Hi,

You can see how to set custom HTML content for a tooltip here: http://demos.telerik.com/aspnet-ajax/tooltip/examples/databasetooltipswithoutlod/defaultvb.aspx. The demo uses a templated div, sets it in the tooltip and populates it with data according to the value property of each tooltip. In your case, you only need to get your div and put it in the tooltip.


Regards,

Marin Bratanov
Telerik

 

 

[Tigger Tag]

Thank you Marin! Going thru the link once again helped me fix the issue. All I needed to add was

sender.set_content($get(dataKeys).innerHTML);

But, the tooltip shows but it closes after few seconds even though the mouse is on the button or on the tooltip itself. How do I make sure as long as the mouse is on the button or the tooltip, the tooltip stays open?

Thank you,
Ana

[Tigger Tag]

Ok, I figured out the property HideEvent is what I need, I thought I needed to set it to LeaveTargetAndTooltip, but that caused the tooltip to close even when the mouse is stayed on the target, but setting LeaveTooltip worked. I didn't find any explanation in the doc as it said they mean what they say, but I thought LeaveTargetAndTooltip is what I needed since I want the tooltip to stay open until the mouse is on target or on the tooltip.

[Marin Bratanov]

Hello,

You can just set the AutoCloseDelay property to 0 so it does not close automatically: http://www.telerik.com/help/aspnet-ajax/tooltip-controlling-delay.html.

You can see the different HideEvent options here: http://demos.telerik.com/aspnet-ajax/tooltip/examples/hideevent/defaultcs.aspx.


Regards,

Marin Bratanov
Telerik