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

Text is being displayed in the background of RadTooltip while dragging a Radlistbox item.

1 Answer 72 Views

ToolTip

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

James asked on 29 Apr 2012, 02:01 PM

TooltipIssue.png

Hi,

I have a RadListBox on a RadTooltip control. When I am trying to drag an item from the radlistbox; the text displayed along with the mouse cursor seen in the background of the RadTooltip window. Kindly suggest a solution for this. Please find the markup of sample page which can demonstrate the issue. A screen capture also has been attached for further clarity.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="ToolTipDragIssue.WebForm1" %>

<%@ 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">

<asp:ScriptManager runat="server" ID="ScriptManager1" />

<asp:Button ID="Button1" runat="server" Text="Click Here" />

<div>

<telerik:RadToolTip ID="RadToolTip1" runat="server" ShowEvent="OnClick" TargetControlID="Button1" HideEvent="ManualClose">

<telerik:RadListBox ID="RadListBox1" runat="server" Width="200px" Height="200px"

AllowTransfer="true" AllowReorder="true" AutoPostBackOnReorder="true" EnableDragAndDrop="true">

<Items>

<telerik:RadListBoxItem Text="Test Item 1 Test Item 1 Test Item 1 " />

<telerik:RadListBoxItem Text="Test Item 2 Test Item 2 Test Item 2 "/>

<telerik:RadListBoxItem Text="Test Item 3 Test Item 3 Test Item 3 "/>

<telerik:RadListBoxItem Text="Test Item 4 Test Item 4 Test Item 4 " />

</Items>

</telerik:RadListBox>

</telerik:RadToolTip>

</div>

</form>

</body>

</html>

Thanks,
James

1 Answer, 1 is accepted

answered on 02 May 2012, 04:00 PM

Hi James,

This happens because of the defauilt z-index values the RadToolTip and the draggable clue from the RadListBox have - 8000 and 6500 respectively. You can change this behavior either by reducing the z-index of the tooltips or by increasing the z-index of the dragged item:

div.rlbDragClue

{

z-index: 9000 !important;

}

div.RadToolTip

{

z-index: 6000 !important;

}

Kind regards,
Marin
the Telerik team

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.