RadDateTimePicker not working client-side

[Diego]

Hello,

I'm having issues when setting the selected and minimum dates on a RadDateTimePicker client-side.

I've two RadDateTimePickers, one for setting the starting datetime (dtpBegin) and other for the ending (dtpEnd) declared as follows:

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="RadAjaxLoadingPanel1">
        ......
    <telerik:RadDateTimePicker ID="dtpBegin" runat="server">
        <ClientEvents OnDateSelected="startDateTimeSelected" OnPopupClosing="startDateTimePopupClosing" />
    </telerik:RadDateTimePicker>
    <telerik:RadDateTimePicker ID="dtpEnd" runat="server">
        <ClientEvents OnPopupClosing="endDateTimePopupClosing" />
    </telerik:RadDateTimePicker>
</telerik:RadAjaxPanel>

<telerik:RadScriptBlock runat="server">
    <script type="text/javascript">
        var endDateTimePickerId = "<%= dtpEnd.ClientID %>";
    </script>
</telerik:RadScriptBlock>

When selecting the starting datetime, I'd like to set the selected value as minimum on the ending control and also would like to set a valid value for that control (say the starting datetime plus 1 minute). To do that, I've the following code client-side:

function startDateTimeSelected(sender, e) {
    if (e.get_newDate != undefined && e.get_newDate() != null) {
        var startDate = e.get_newDate();
        var endDateTimePicker = $find(endDateTimePickerId);

        endDateTimePicker.set_minDate(e.get_newDate());
        if (endDateTimePicker.get_timeView().getTime() < startDate) {
            var timeView = timePicker.get_timeView();
            timeView.setTime(newDate.getHours(), newDate.getMinutes() + 1, newDate.getSeconds(), newDate);
        }
    }
}

Now, even though the calls to set_minDate and setTime are not throwing any errors, the selected date on dtpEnd is not changed neither is the minimum date time set. One thing I find weird is that after setting the time on dtpEnd, if I run on Firebug's console:

$find(endDateTimePickerId).get_timeView().getTime()

 I get null.

And regarding the minimum date, if I run on Firebug's console:

$find(endDateTimePickerId).get_minDate()

I get the expected value (even though the calendar allows to select any value).
One extra thing that might be useful for troubleshooting is that I'm also setting the MinDate server-side for these two controls (setting it to DateTime.Now to forbid users selecting past datetimes).

Thanks a lot,
Diego.

[Maria Ilieva]

Hi Diego,

I would suggest you to review the online demo below which presents the main client side functionalities of the RadDatePicker control. I hope this helps:
http://demos.telerik.com/aspnet-ajax/calendar/examples/datepicker/clientapi/defaultcs.aspx

Greetings,
Maria Ilieva
the Telerik team

[Diego]

Hi Maria,

I've tried to reproduce the issue on a new solution and the same code works fine when using the two RadDateTimePickers on a clean page, so it seems to me that the issue has to do with this specific implementation.
I've switched the reference to a debug build of Telerik.Web.UI (which BTW is version number 2010.2.826) and followed the javascript execution on firebug, and I think the issue is related to the update done through ASP.NET AJAX Toolkit, specifically in the method updateDisplayValue of RadDateInput (line 112 of RadDateInput.js), hidden values are updated correctly on set_minDate and set_selectedDate invocation, though visible UI elements are not (text box and calendar/time popups).

Do you think you can pinpoint the issue with this information? Let me know if I can provide any extra data that's useful for you.

Thanks,
Diego.

[Maria Ilieva]

Hi Diego,

It will be rather difficult to isolate the root cause of the issue form the provided information. It will be very helpful if you could open a regular support ticket and send us runnable version of your application which demonstrates the problematic behaviour. Thus we will be able to debug it locally and advise you further.

Greetings,
Maria Ilieva
the Telerik team