8 Answers, 1 is accepted
0
Hello tspossible,
I was able to reproduce the problem you describe - the calendar of the RadDatePicker is displayed behind the RadToolTip. I have forwarded this issue to our developers and we will fix it as soon as possible.
Regards,
Tsvetie
the telerik team
Instantly find answers to your questions at the new Telerik Support Center
I was able to reproduce the problem you describe - the calendar of the RadDatePicker is displayed behind the RadToolTip. I have forwarded this issue to our developers and we will fix it as soon as possible.
Regards,
Tsvetie
the telerik team
Instantly find answers to your questions at the new Telerik Support Center
0
ragingpixel
Top achievements
Rank 1
answered on 03 Jul 2007, 05:01 AM
I am experiencing a similar problem using the RadDateTimePicker from within a RadToolTip. One additional thing to note is that when using both date and time pickers, which ever control you click first will popup behind the ToolTip, and the second will load in front of it like normal.
I am using the most recent Prometheus hotfix (build 2007.1.626.0)... any word on a solution?
I am using the most recent Prometheus hotfix (build 2007.1.626.0)... any word on a solution?
0
Hi ragingpixel,
Here is a code snippet that demonstrates how you could work around this problem by modifying the z-index value of the tooltip wrapper:
Sorry for the inconvenience.
Best wishes,
Manuel
the Telerik team
Instantly find answers to your questions at the new Telerik Support Center
Here is a code snippet that demonstrates how you could work around this problem by modifying the z-index value of the tooltip wrapper:
<html xmlns="http://www.w3.org/1999/xhtml"> |
<head runat="server"> |
<title>Untitled Page</title> |
<style type="text/css"> |
/* the id of the wrapper element is formed like this: |
RadTooltipWrapper_[your-RadToolTip-ID] |
*/ |
#RadToolTipWrapper_Tooltip1 |
{ |
z-index: 49999 !important; |
} |
</style> |
</head> |
<body> |
<form id="form1" runat="server"> |
<asp:ScriptManager runat="server" ID="ScriptManager"> |
</asp:ScriptManager> |
<div> |
<script type="text/javascript"> |
// in order to avoid a floating open calendar / time popup if the tooltip is closed prior to date / time selection |
function OnBeforeHide() |
{ |
var picker1 = <%= RadDatePicker1.ClientID %>; |
var picker2 = <%= RadDateTimePicker1.ClientID %>; |
if (picker1.IsPopupVisible()) |
picker1.TogglePopup(); |
else if (picker2.IsPopupVisible()) |
picker2.TogglePopup(); |
else if (picker2.IsTimePopupVisible()) |
picker2.ToggleTimePopup(); |
} |
</script> |
<asp:Label ID="Label1" runat="server" Text="Label With ToolTip"></asp:Label> |
<telerik:RadToolTip ID="Tooltip1" runat="server" TargetControlID="Label1" IsClientID="true" |
ManualClose="true" Height="100px" Width="500px" CssClass="pickerFix" OnClientBeforeHide="OnBeforeHide"> |
<radCln:RadDatePicker ID="RadDatePicker1" runat="server"> |
</radCln:RadDatePicker> |
<radCln:RadDateTimePicker ID="RadDateTimePicker1" runat="server"> |
</radCln:RadDateTimePicker> |
</telerik:RadToolTip> |
</div> |
</form> |
</body> |
</html> |
Sorry for the inconvenience.
Best wishes,
Manuel
the Telerik team
Instantly find answers to your questions at the new Telerik Support Center
0
Jimmie Houts
Top achievements
Rank 1
answered on 23 Jul 2007, 05:59 PM
This fix doesn't seem to be working for me. The calendar is still hidden. I have the tooltip inside of a prometheus raddock. Could that be the problem?
0
Hi Jimmie Houts,
In the case of RadDock, you will additionally have to handle the ClientDragEnd event of the Dock object and set the zIndex of the Popup when the page first loads:
Regards,
Tsvetie
the Telerik team
Instantly find answers to your questions at the new Telerik Support Center
In the case of RadDock, you will additionally have to handle the ClientDragEnd event of the Dock object and set the zIndex of the Popup when the page first loads:
<html xmlns="http://www.w3.org/1999/xhtml"> |
<head id="Head1" runat="server"> |
<title>Untitled Page</title> |
<style type="text/css"> |
/* the id of the wrapper element is formed like this: |
RadTooltipWrapper_[your-RadToolTip-ID] |
*/ |
#RadToolTipWrapper_Tooltip1 |
{ |
z-index: 49999 !important; |
} |
</style> |
</head> |
<body onload="SetMyZIndex();"> |
<script type="text/javascript"> |
function ClientDragEndHandler(obj, args) |
{ |
var el = obj.get_element(); |
el.style.zIndex = "1"; |
} |
function SetMyZIndex() |
{ |
RadCalendarNamespace.Popup.zIndex = "50002"; |
} |
</script> |
<form id="form1" runat="server"> |
<asp:ScriptManager runat="server" ID="ScriptManager"> |
</asp:ScriptManager> |
<div> |
<script type="text/javascript"> |
// in order to avoid a floating open calendar / time popup if the tooltip is closed prior to date / time selection |
function OnBeforeHide() |
{ |
var picker1 = <%= RadDatePicker1.ClientID %>; |
var picker2 = <%= RadDateTimePicker1.ClientID %>; |
if (picker1.IsPopupVisible()) |
picker1.TogglePopup(); |
else if (picker2.IsPopupVisible()) |
picker2.TogglePopup(); |
else if (picker2.IsTimePopupVisible()) |
picker2.ToggleTimePopup(); |
} |
</script> |
<telerik:RadDock ID="RadDock1" runat="server" Height="200px" |
OnClientDragEnd="ClientDragEndHandler"> |
<ContentTemplate> |
<asp:Label ID="Label1" runat="server" Text="Label With ToolTip"></asp:Label> |
<telerik:RadToolTip ID="Tooltip1" runat="server" TargetControlID="Label1" |
ManualClose="true" Height="100px" Width="500px" CssClass="pickerFix" |
OnClientBeforeHide="OnBeforeHide"> |
<radCln:RadDatePicker ID="RadDatePicker1" runat="server"> |
</radCln:RadDatePicker> |
<radCln:RadDateTimePicker ID="RadDateTimePicker1" runat="server"> |
</radCln:RadDateTimePicker> |
</telerik:RadToolTip> |
</ContentTemplate> |
</telerik:RadDock> |
</div> |
</form> |
</body> |
</html> |
Regards,
Tsvetie
the Telerik team
Instantly find answers to your questions at the new Telerik Support Center
0
Jimmie Houts
Top achievements
Rank 1
answered on 26 Jul 2007, 06:28 PM
That worked perfectly, thank you!
0
Nicolaï
Top achievements
Rank 2
answered on 30 Sep 2009, 12:57 PM
Hi,
similar problem: raddatepicker inside a modal tooltip.
The calendar appears under the tooltip.
Adding
<style type="text/css">
#RadToolTipWrapper_editContainerTT
{
z-index: 49999 !important;
}
</style>
did not help.
also noticed you have CssClass="pickerFix", but I don't see its definition..?
Has anything changed in later versions?
TT is like this:
<telerik:RadToolTip runat="server" ID="editContainerTT" Skin="Office2007"
RelativeTo="Element" Position="TopRight"
ShowEvent="FromCode" HideEvent="FromCode" Modal="true"
OnClientShow="OnClientShow_cont">
<table rules="all">
<tr>
[...many things]
<td>
<telerik:RadDatePicker runat="server" ID="cTestDateTB" style="z-index:9999;">
<Calendar runat="server" style="z-index:9999;"></Calendar>
</telerik:RadDatePicker>
</td>
<td>
<telerik:RadDatePicker runat="server" ID="nTestDateTB">
</telerik:RadDatePicker>
</td>
Best regards,
Nicolai
update: not only did it not help, but it made my radcombo also appear under the tooltip (to which I had added ZIndex="9999").
similar problem: raddatepicker inside a modal tooltip.
The calendar appears under the tooltip.
Adding
<style type="text/css">
#RadToolTipWrapper_editContainerTT
{
z-index: 49999 !important;
}
</style>
did not help.
also noticed you have CssClass="pickerFix", but I don't see its definition..?
Has anything changed in later versions?
TT is like this:
<telerik:RadToolTip runat="server" ID="editContainerTT" Skin="Office2007"
RelativeTo="Element" Position="TopRight"
ShowEvent="FromCode" HideEvent="FromCode" Modal="true"
OnClientShow="OnClientShow_cont">
<table rules="all">
<tr>
[...many things]
<td>
<telerik:RadDatePicker runat="server" ID="cTestDateTB" style="z-index:9999;">
<Calendar runat="server" style="z-index:9999;"></Calendar>
</telerik:RadDatePicker>
</td>
<td>
<telerik:RadDatePicker runat="server" ID="nTestDateTB">
</telerik:RadDatePicker>
</td>
Best regards,
Nicolai
update: not only did it not help, but it made my radcombo also appear under the tooltip (to which I had added ZIndex="9999").
0
Hello Nicolai,
You should use the ZIndex property of the RadDatePicker to set the correct z-index for the calendar:
Sincerely yours,
Tsvetie
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
You should use the ZIndex property of the RadDatePicker to set the correct z-index for the calendar:
<telerik:RadToolTip runat="server" ID="editContainerTT" TargetControlID="Label1" Skin="Office2007" RelativeTo="Element" |
Position="TopRight" HideEvent="FromCode" Modal="true"> |
<table rules="all"> |
<tr> |
<td> |
<telerik:RadDatePicker runat="server" ID="cTestDateTB" ZIndex="9999"> |
<Calendar ID="Calendar1" runat="server"> |
</Calendar> |
</telerik:RadDatePicker> |
</td> |
<td> |
<telerik:RadDatePicker runat="server" ID="nTestDateTB" ZIndex="9999"> |
</telerik:RadDatePicker> |
</td> |
</tr> |
</table> |
</telerik:RadToolTip> |
Sincerely yours,
Tsvetie
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.