Can't retrieve RadDatePicker object from Javascript

[dstj]

Hi,

I'm pulling my hair over this, I can't get the Client-Side API of RadDatePicker to work. The object has no function or no properties...

Can you help me to find what is wrong with this code on a blank aspx page?

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

<telerik:RadDatePicker ID="rdtpBegin" runat="server" SharedCalendarID="sharedCalendar" />
<telerik:RadDatePicker ID="rdtpEnd" runat="server" SharedCalendarID="sharedCalendar" />
<telerik:RadCalendar ID="sharedCalendar" runat="server" />

<script type="text/javascript">
   var picker = $find("<%= rdtpBegin.ClientID %>");
   if (picker.get_selectedDate() == null) {
      var defaultDate = new Date();
      picker.control.set_selectedDate(defaultDate);
   }
</script>

I get a "picker has no properties" javascript error... I tried with document.getElementById() with no help. I tried from code-behind with RegisterStartupScript but that didn't work either...

Thanks for your assistance,

Dominic.
p.s using v2008.1.515.20

[Shinu]

Hi,

Try accessing the DatePicker in any client events as shown in the following link.

Displaying The Popup Above The Input Area
RadDatePicker Client Object

Shinu

[dstj]

Hi, "la nuit porte conseil"... I've found a "solution" while sleeping.

Setting a delay with "setTimeout()" fixes the javascript error. It seems that the client object isn't initialized early enough for my call to work.

So this works :

<telerik:RadDatePicker ID="rdtpBegin" runat="server" SharedCalendarID="sharedCalendar" />
<telerik:RadDatePicker ID="rdtpEnd" runat="server" SharedCalendarID="sharedCalendar" />
<telerik:RadCalendar ID="sharedCalendar" runat="server" />

<script type="text/javascript">
function init() {
   var picker = $find("<%= rdtpBegin.ClientID %>");
   if (picker.get_selectedDate() == null) {
      var defaultDate = new Date();
      picker.set_selectedDate(defaultDate);
   }
}
setTimeout (init, 500);
</script>

or using document.getElementById() :

<telerik:RadDatePicker ID="rdtpBegin" runat="server" SharedCalendarID="sharedCalendar" />
<telerik:RadDatePicker ID="rdtpEnd" runat="server" SharedCalendarID="sharedCalendar" />
<telerik:RadCalendar ID="sharedCalendar" runat="server" />

<script type="text/javascript">
function init() {
   var picker = document.getElementById("<%= rdtpBegin.ClientID %>");
   if (picker.control.get_selectedDate() == null) {
      var defaultDate = new Date();
      picker.control.set_selectedDate(defaultDate);
   }
}
setTimeout (init, 500);
</script>

The minimum timeout I got working was 30ms. But, is this workaround really reliable? Any thoughts ?

And thanks Shinu, you got me thinking, using the client event OnLoad works too :

<telerik:RadDatePicker ID="rdtpBegin" runat="server" SharedCalendarID="sharedCalendar" />
<telerik:RadDatePicker ID="rdtpEnd" runat="server" SharedCalendarID="sharedCalendar" DateInput-ClientEvents-OnLoad="init2" />
<telerik:RadCalendar ID="sharedCalendar" runat="server" />

<script type="text/javascript">
function init2(sender) {
   if (sender.get_selectedDate() == null) {
      var defaultDate = new Date();
      sender.set_selectedDate(defaultDate);
   }
}
</script>

I'll try to figure out how to do what I want from this...

Dominic.