New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Displaying RadDatePicker Dropdown Popup in AjaxControlToolkit ModalPopup Window


Property Value
Product RadDatePicker for ASP.NET AJAX
Version all


When using an AjaxControlToolkit modalpopup window, the RadDatePicker dropdown popup may not be displayed correctly due to its lower z-index.


To address this issue and ensure that the RadDatePicker dropdown popup is displayed correctly within the AjaxControlToolkit modalpopup window, you can follow these steps:

  1. Add the following JavaScript code to your page:
function popupOpening(sender, args) {
    var popup = args.get_popupControl();
    setTimeout(function () {
        popup.get_element()'z-index', '103000', 'important');
  1. Modify your RadDatePicker control by adding the OnPopupOpening attribute and set it to the popupOpening JavaScript function:
<telerik:RadDatePicker RenderMode="Lightweight" ID="RadDatePicker2" runat="server">
    <ClientEvents OnPopupOpening="popupOpening" />
In this article