To define a shared popup control at design time,

1. Drag and drop a RadCalendar or RadTimeView control onto the Web page that contains your RadDatePicker, RadTimePicker, and/or RadDateTimePicker controls.

2. Set the properties of the RadCalendar or RadTimeView control to configure the popup. Unlike the embedded popup controls that are automatically created when you are not using a shared calendar or time view, the external RadCalendar or RadTimeView control does not inherit any properties (such as Skin or RangeMaxDate and RangeMinDate) from the parent control that uses it.

   Caution
   Do not set the AutoPostBack property to True. A popup control cannot work properly if it causes postbacks.

3. Set the SharedCalendarID property of all RadDatePicker and RadDateTimePicker controls to the ID property of the RadCalendar control and/or set the SharedTimeViewID property of all RadDateTimePicker and RadTimePicker controls to the ID property of the RadTimeView control.

CopyASPX

     

<telerik:RadDatePicker
    ID="RadDatePicker1"
    runat="server"
    SharedCalendarID="SharedCalendar">
</telerik:RadDatePicker>
<br />
<telerik:RadDateTimePicker
    ID="RadDateTimePicker1"
    runat="server"
    SharedCalendarID="SharedCalendar"
    SharedTimeViewID="SharedTimeView">
</telerik:RadDateTimePicker>
<br />
<telerik:RadTimePicker
    ID="RadTimePicker1"
    runat="server"
    SharedTimeViewID="SharedTimeView">
</telerik:RadTimePicker>
<telerik:RadTimeView
    ID="SharedTimeView"
    runat="server"
    Skin="Inox">
</telerik:RadTimeView>
<telerik:RadCalendar
    ID="SharedCalendar"
    runat="server"
    EnableMonthYearFastNavigation="False"
    EnableMultiSelect="False"
    UseColumnHeadersAsSelectors="False"
    UseRowHeadersAsSelectors="False"
    Skin="Inox">
</telerik:RadCalendar>

Note
When you assign the RadCalendar or RadTimeView control's ID as the value of a SharedCalendarID or SharedTimeViewID property, it is automatically hidden from view in the rendered Web page. You do not need to do anything additional to hide it such as placing it in a hidden panel.

To define a shared popup control at runtime

1. Do not set the Calendar or TimeView properties of the RadDatePicker, RadTimePicker, or RadDateTimePicker control at design time.

2. Add a PlaceHolder for holding the dynamically created popups.

3. In the codebehind, create an instance of the shared RadCalendar and/or RadTimeView object, setting its properties to configure it. Remember that this instance does not inherit any properties from the RadDatePicker, RadTimePicker, or RadDateTimePicker controls that use them.

4. Add the instance of the RadCalendar or RadTimeView to the PlaceHolder you added at design time.

5. Assign the RadCalendar and/or RadTimeView instance as the value of the SharedCalendar and/or SharedTimeView property.

• ASPNET
• C#
• VB.NET

CopyASPX

     
<telerik:RadDatePicker ID="RadDatePicker1" runat="server" />
<br />
<telerik:RadDateTimePicker ID="RadDateTimePicker1" runat="server" />
<br />
<telerik:RadTimePicker ID="RadTimePicker1" runat="server" />
<asp:PlaceHolder ID="sharedCalendarPlaceHolder" runat="server" />

CopyC#

protected void Page_Load(object sender, EventArgs e)
{
    RadCalendar popupCal = new RadCalendar();
    popupCal.ID = "sharedDynamicCalendar";
    popupCal.EnableMultiSelect = false;
    popupCal.Skin = "Inox";
    popupCal.EnableMonthYearFastNavigation = false;
    popupCal.UseColumnHeadersAsSelectors = false;
    popupCal.UseRowHeadersAsSelectors = false;
    sharedPopupPlaceHolder.Controls.Add(popupCal);
    RadDatePicker1.SharedCalendar = popupCal;
    RadDateTimePicker1.SharedCalendar = popupCal;
    RadTimeView popupTime = new RadTimeView();
    popupTime.ID = "sharedDynamicTimeView";
    popupTime.Skin = "Inox";

    sharedPopupPlaceHolder.Controls.Add(popupTime);
    RadTimePicker1.SharedTimeView = popupTime;
    RadDateTimePicker1.SharedTimeView = popupTime;
}

CopyVB.NET

 

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    Dim popupCal As New RadCalendar()
    popupCal.ID = "sharedDynamicCalendar"
    popupCal.EnableMultiSelect = False
    popupCal.Skin = "Inox"
    popupCal.EnableMonthYearFastNavigation = False
    popupCal.UseColumnHeadersAsSelectors = False
    popupCal.UseRowHeadersAsSelectors = False
    sharedPopupPlaceHolder.Controls.Add(popupCal)
    RadDatePicker1.SharedCalendar = popupCal
    RadDateTimePicker1.SharedCalendar = popupCal
    Dim popupTime As New RadTimeView()
    popupTime.ID = "sharedDynamicTimeView"
    popupTime.Skin = "Inox"
    sharedPopupPlaceHolder.Controls.Add(popupTime)
    RadTimePicker1.SharedTimeView = popupTime
    RadDateTimePicker1.SharedTimeView = popupTime
End Sub