Completed
Last Updated: 17 Dec 2020 18:54 by ADMIN
Satish
Created on: 30 May 2017 07:14
Category: Calendar
Type: Bug Report
1
Javascript error after ajax postback on RadDatePicker with SharedCalendar
Put more than two RadDatePicker with single SharedCalendar on page. some RadDatePicker are in side of UpdatePanel with a button in it. when I press that button RadDatePicker behaviour is strange. 
RadDatePicker inside UpdatePanel not opening Calendar popup while RadDatePicker outside UpdatePanel opens calendar popup but gives javascript error on any date selection. the javascript error is "Unable to get property '_selectedDates' of undefined or null reference".
It looks like it is destroying shared calendar object on partial postback.
Please find below sample code to replicate the issue. after clicking "Submit" button, it doesn't open calendar popup for "Date 2" and for "Date 1" it opens but doesn't allow to select date and gives JavaScript error.

----------------------
<asp:ScriptManager ID="sc1" runat="server" />
<telerik:RadCalendar ID="dtCal" runat="server" EnableMultiSelect="false" />
Date 1:
<telerik:RadDatePicker ID="dt1" Width="103px" runat="server" SharedCalendarID="dtCal" />
<hr />
<asp:UpdatePanel runat="server" ID="up">
	<ContentTemplate>
		Date 2:
		<telerik:RadDatePicker ID="dt2" Width="103px" runat="server" SharedCalendarID="dtCal" />
		<br />
		<asp:Button runat="server" ID="btnDT" Text="Submit" />
	</ContentTemplate>
</asp:UpdatePanel>
----------------------

When i add all controls in UpdatePanel it works properly. but Actual code is much more complex than above sample with too many lines of javascript code and many date pickers on single page and simply all Calendar and DatePicker controls can not be moved in UpdatePanel.
1 comment
ADMIN
Attila Antal
Posted on: 17 Dec 2020 18:54

Hi Satish,

Thank you for reporting this problem.

If the SharedCalendar is excluded from the UpdatePanel the application indeed will break. That is because during the AJAX update only one part of the Controls are Updated and the ShareCalendar object gets destroyed.

To avoid that problem you will need to include the SharedCalendar in the UpdatePanel together with the DateTimePicker that uses it:

Example:

<asp:UpdatePanel runat="server" ID="up">
    <ContentTemplate>
        <telerik:RadCalendar ID="dtCal" runat="server" EnableMultiSelect="false" />
        <telerik:RadDatePicker ID="dt2" Width="103px" runat="server" SharedCalendarID="dtCal" />
        <br />
        <asp:Button runat="server" ID="btnDT" Text="Submit" />
    </ContentTemplate>
</asp:UpdatePanel>

 

Or you could have the SharedCalendar inside a separate UpdatePanel if you want to keep it away from the rest of the Controls. In that case, you will need to set the UpdateMode mode to Always (Default value)

Example:

<asp:UpdatePanel runat="server" ID="SharedCalendarUpdatePanel" UpdateMode="Always">
    <ContentTemplate>
        <telerik:RadCalendar ID="dtCal" runat="server" EnableMultiSelect="false" />
    </ContentTemplate>
</asp:UpdatePanel>
Date 1:
<telerik:RadDatePicker ID="dt1" Width="103px" runat="server" SharedCalendarID="dtCal" />
<hr />
<asp:UpdatePanel runat="server" ID="up">
    <ContentTemplate>
        Date 2:
        <telerik:RadDatePicker ID="dt2" Width="103px" runat="server" SharedCalendarID="dtCal" />
        <br />
        <asp:Button runat="server" ID="btnDT" Text="Submit" />
    </ContentTemplate>
</asp:UpdatePanel>

 

Regards,
Attila Antal
Progress Telerik