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

RadDatePicker calendar popup hidden under PDF

7 Answers 171 Views
Calendar
This is a migrated thread and some comments may be shown as answers.
Nicolas
Top achievements
Rank 1
Nicolas asked on 11 Dec 2012, 06:38 PM
Hi,

I have a RadDatePicker with a calendar popup. The problem is the popup is hidden behind a PDF file loaded in a radpane just below the RadDatePicker control.

What I'm searching for is a solution similar to this one but with RadDatePicker:
http://www.telerik.com/support/kb/aspnet-ajax/window/control-is-shown-behind-a-heavy-weight-object-pdf-flash-activex-etc.aspx

I have tested the Overlay on RadColorPicker and it works perfectly for what I want to do. Do you have something similar for the DatePicker?

Thank you

7 Answers, 1 is accepted

Sort by
0
Accepted
Vasil
Telerik team
answered on 14 Dec 2012, 01:49 PM
Hi Nicolas,

The RadDatePicker currently does not have such functionality. We are planing to make it for some future release. Currently you could implement it for your custom scenario using simple workaround.
You could use a iframe positioned below the expected position of the calendar's popup. It is not necessarily the calendar to be inside the iframe , it could be on top of it, and it will be visible on top of the pdf as well.

Here is workaround for similar problem:
http://www.telerik.com/community/forums/aspnet-ajax/ajax/radajaxloadingpanel-behind-java-applet.aspx
You could use the same principle for resolving the problem. Just handle the OnPopupShowing and OnPopupClosing of RadDatePicker to change the display of the iframe.

All the best,
Vasil
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.
0
Nicolas
Top achievements
Rank 1
answered on 14 Dec 2012, 05:36 PM
Thanks, this seems to work!
0
David Morin
Top achievements
Rank 1
answered on 24 May 2013, 02:13 PM
I have a similar problem, but the calendar is showing up behind an activeX control.   I don't see the OnPopupShowing or OnPopupClosing events on the RadDatePicker control.  I am using v 2013.1.417.40.  Are these events not part of this version?
0
Vasil
Telerik team
answered on 27 May 2013, 06:20 AM
Hello David,

They are in the ClientEvents inner property.

<script type="text/javascript">
    function OnClosing(sender, args)
    {
 
    }
    function OnOpening(sender, args)
    {
 
    }
</script>
<telerik:RadDatePicker runat="server">
    <ClientEvents OnPopupClosing="OnClosing" OnPopupOpening="OnOpening" />
</telerik:RadDatePicker>


Regards,
Vasil
Telerik
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.
0
David Morin
Top achievements
Rank 1
answered on 28 May 2013, 04:02 PM

Can you provide a working sample of having the calendar popup appear in front?
 
What I have done is I put a iframe and a RadAjaxLoadingPanel on the page as shown below:

<telerik:RadAjaxLoadingPanel ID="ralp" runat="server" />

<object id="oUploader" style="HEIGHT: 256px; TEXT-ALIGN: center; z-index:-99; "

codebase="SM_Ctls_setup.exe#version=1,1,0,1" width="100%"

classid="clsid:2CA395F0-797E-4D1F-8464-B9AB4A0CBF72" >

<param name="_ExtentX" value="17727"/>

<param name="_ExtentY" value="6773"/>

</object>

<iframe id="iframe" scrolling="no" frameborder="0" src="javascript:'<html></html>';"

The following code has been place in the PageLoad event: oLoadingPanel = $find("<%=ralp.ClientID%>");
oUpdatedControl = "oUploader";
oLoadingPanel.show(oUpdatedControl);
var iframe = $get("iframe");
var showedPanel = $get(oLoadingPanel.get_id() + oUpdatedControl);
iframe.style.top = showedPanel.style.top;
iframe.style.left = showedPanel.style.left;
iframe.style.visibility = "hidden";

The following code has been place in the OnOpening event:

var iframe = $get("iframe");
iframe.style.visibility = "visible";

var datePicker;

datePicker = $find("<%= rdpStudyDate.ClientID %>");

var textBox = datePicker.get_textBox();
var popupElement = datePicker.get_popupContainer();
var dimensions = datePicker.getElementDimensions(popupElement);
var position = datePicker.getElementPosition(textBox);
var tb_dimensions = datePicker.getElementDimensions(textBox);
var iTop = position.y + tb_dimensions.height;

iframe.style.left = position.x + "px";
iframe.style.top = position.y + "px";
iframe.style.width = dimensions.width + "px";
iframe.style.height = iTop + "px";



This seemed to do the trick as far as being able to view the entire popup. However, if I try to click on the portion of the calendar that would of appeared behind the activex control, it doesn't respond. It appears to be disabled.  Also when I try to select a year from the secondary popup, part of that popup is not visible.

 

Thanks,
  Dave

0
Vasil
Telerik team
answered on 31 May 2013, 10:29 AM
Hi Dave,

I could not known what exact problem is, and why the calendar shows but can not be clicked, If you can insulate the issue in sample page, I could debug it further.

We could do this functionality internal for the RadDatePicker possibly for our Q3 release. Please vote for it here to get greater priority:
http://feedback.telerik.com/Project/108/Feedback/Details/49619-add-overlay-property-for-controls-that-have-pop-ups-such-as-raddatepicker-radgri

Regards,
Vasil
Telerik
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.
0
David Morin
Top achievements
Rank 1
answered on 07 Jun 2013, 01:09 PM
Thank you for your help.  We ended up switching to the calendar control provided by the AJAX control toolkit.
Tags
Calendar
Asked by
Nicolas
Top achievements
Rank 1
Answers by
Vasil
Telerik team
Nicolas
Top achievements
Rank 1
David Morin
Top achievements
Rank 1
Share this question
or