Not answered $find returns NULL for calendar

Feed from this thread

Erik Hinds avatar

Posted on Jul 1, 2009 (permalink)

I am trying to set the mindate on a calendar based on the selection from another

    
             Private Sub SetCalendars() 
        
            'Add the popup javascript event 
        
                        txtDiscSubStartDate.DateInput.Attributes.Add("OnClick", "ShowCalendarPopup1();") 
        
                        txtDiscSubEndDate.DateInput.Attributes.Add("OnClick", "ShowCalendarPopup1();") 
        
                        'Add the MinDate event 
        
                        txtDiscSubStartDate.ClientEvents.OnDateSelected = "SetMinDate()" 
        
            'Create Javascript 
        
                        Dim sb As New StringBuilder 
        
                        sb.Append("<script type=""text/javascript"">") 
        
                        sb.Append("function ShowCalendarPopup1()") 
        
                        sb.Append("{") 
        
                        sb.Append("$find(""" & txtDiscSubStartDate.ClientID & """).showPopup();") 
        
                        sb.Append("$find(""" & txtDiscSubEndDate.ClientID & """).showPopup();") 
        
                        sb.Append("}") 
        
                        sb.Append("function SetMinDate()") 
        
                        sb.Append("{") 
        
                        sb.Append("var subStartDateCtl = $find(""" & txtDiscSubStartDate.ClientID & """); ") 
        
                        sb.Append("var subEndDateCtl = $find(""" & txtDiscSubEndDate.ClientID & """); ") 
        
                        'sb.Append("alert(subStartDateCtl);") 
        
                        sb.Append("var date = subStartDateCtl.get_selectedDate();") 
        
                        sb.Append("if (subStartDateCtl.isEmpty())") 
        
                        sb.Append("subEndDateCtl.set_minDate(date);") 
        
                        sb.Append("") 
        
                        sb.Append("}") 
        
                        sb.Append("</script>") 
        
                        'register script 
        
                        If Not DotNetNuke.UI.Utilities.ClientAPI.IsClientScriptBlockRegistered(Page, "RadCal") Then 
        
                            DotNetNuke.UI.Utilities.ClientAPI.RegisterClientScriptBlock(Page, "RadCal", sb.ToString) 
        
                        End If 
        
                    End Sub

This is called in my page load event. The javascript for ShowCalendarPopup1 works flawlessly and the $find does not go null. In the SetMinDate function, the subStartDateCtl variable is always null, even though the ID of the control is there. I put an alert box around txtDiscSubStartDate.ClientId and it pops up the controls id number.

So why is it coming back as a null object?

Here is the front end code of my ascx:

    
            <telerik:RadDatePicker ID="txtDiscSubStartDate" Style="vertical-align: middle;" MinDate="2006-2-1" 
        
                                            SelectedDate="2006-04-01" runat="server" Skin="Vista"> 
        
                                            <DatePopupButton Visible="False" CssClass="" HoverImageUrl="" ImageUrl=""></DatePopupButton> 
        
                                            <DateInput SelectedDate="2006-04-01" Width="150px"> 
        
                                            </DateInput> 
        
                                            <Calendar UseColumnHeadersAsSelectors="False" UseRowHeadersAsSelectors="False" ViewSelectorText="x"> 
        
                                            </Calendar> 
        
                                        </telerik:RadDatePicker> 
        
            <br /> 
        
            <telerik:RadDatePicker ID="txtDiscSubEndDate" Style="vertical-align: middle;" MinDate="2006-2-1" 
        
                                            SelectedDate="2006-04-01" runat="server" Skin="Vista"> 
        
                                        <DateInput SelectedDate="2006-04-01" Width="150px"> 
        
                                        </DateInput> 
        
                                        <Calendar UseColumnHeadersAsSelectors="False" UseRowHeadersAsSelectors="False" ViewSelectorText="x"> 
        
                                        </Calendar> 
        
                                        <DatePopupButton CssClass="" HoverImageUrl="" ImageUrl="" Visible="False" /> 
        
                                    </telerik:RadDatePicker>

Telerik Admin

Posted on Jul 1, 2009 (permalink)

Hello Erik,

Most probably, you are trying to obtain a reference to a client control instance before the client control object has been initialized. Here is some related reading:

http://blogs.telerik.com/dimodimov/posts/08-12-13/don_t_use_body_onload_in_asp_net_ajax_websites.aspx

Sincerely yours,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

Reply
Erik Hinds

Posted on Jul 2, 2009 (permalink)

I tried putting my script in several different places, but it still errors. Do I have to register my script after each telerik control loads? That seems very time consuming.

I tried onLoad and Init.

Reply
Erik Hinds

Posted on Jul 3, 2009 (permalink)

Is there an expert on staff with dnn custom module integrations? I've tried several different combinations, all with the same result.

Reply
Telerik Admin

Posted on Jul 3, 2009 (permalink)

Hi Erik,

The important thing is not when or where the script is registered, but when it is executed. From your code snippet I can't tell when the two functions are executed, but you should make sure that this happens after the ASP.NET AJAX client instances have been created. For example this should work:

<script type="text/javascript">

Sys.Application.add_load(myfuncs);

function myfuncs()
{
SetMinDate();
ShowCalendarPopup1();
}

</script>

Regards,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

Reply
Erik Hinds

Posted on Jul 3, 2009 (permalink)

The functions should execute on the click events.
            txtDiscSubStartDate.ClientEvents.OnDateSelected = "SetMinDate()"

is set in the page load event. I also tried setting it on the client side, to no avail. (<ClientEvents OnDateSelected="SetMinDate()" />)

function SetMinDate()
{
   var subStartDateCtl = $find('<%=txtDiscSubStartDate.ClientID %>');
   var subEndDateCtl = $find('<%=txtDiscSubEndDate.ClientID%>');
          // alert(subStartDateCtl);
   var date = subStartDateCtl.get_selectedDate();
   if (subStartDateCtl.isEmpty())
   subEndDateCtl.set_minDate(date);

}

Sys.Application.add_load(myfuncs); does not work either

Reply

Telerik Admin admin's avatar

Posted on Jul 6, 2009 (permalink)

Hi Erik Hinds,

I inspected your code again and actually, the problem is in this line:

txtDiscSubStartDate.ClientEvents.OnDateSelected = "SetMinDate()"

You should remove the brackets.

Here is a page which works as expected:

    
            <%@ Page Language="VB" %> 
        
            <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
        
            <script runat="server"> 
        
                Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) 
        
                    'Add the popup javascript event  
        
                    txtDiscSubStartDate.DateInput.Attributes.Add("OnClick", "ShowCalendarPopup1();") 
        
                    txtDiscSubEndDate.DateInput.Attributes.Add("OnClick", "ShowCalendarPopup1();") 
        
                    'Add the MinDate event  
        
                    txtDiscSubStartDate.ClientEvents.OnDateSelected = "SetMinDate" 
        
                    'Create Javascript  
        
                    Dim sb As New StringBuilder 
        
                    sb.Append("<script type=""text/javascript"">") 
        
                    sb.Append("function ShowCalendarPopup1()") 
        
                    sb.Append("{") 
        
                    sb.Append("$find(""" & txtDiscSubStartDate.ClientID & """).showPopup();") 
        
                    sb.Append("$find(""" & txtDiscSubEndDate.ClientID & """).showPopup();") 
        
                    sb.Append("}") 
        
                    sb.Append("function SetMinDate()") 
        
                    sb.Append("{") 
        
                    sb.Append("var subStartDateCtl = $find(""" & txtDiscSubStartDate.ClientID & """); ") 
        
                    sb.Append("var subEndDateCtl = $find(""" & txtDiscSubEndDate.ClientID & """); ") 
        
                    sb.Append("var date = subStartDateCtl.get_selectedDate();") 
        
                    sb.Append("if (subStartDateCtl.isEmpty())") 
        
                    sb.Append("subEndDateCtl.set_minDate(date);") 
        
                    sb.Append("") 
        
                    sb.Append("}") 
        
                    sb.Append("</" & "script>") 
        
                    Me.Page.ClientScript.RegisterClientScriptBlock(Me.Page.GetType(), "RadCal", sb.ToString()) 
        
                End Sub 
        
            </script> 
        
            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        
            "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
        
            <html xmlns="http://www.w3.org/1999/xhtml"> 
        
            <head runat="server"> 
        
            <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
        
            <title>RadControls for ASP.NET AJAX</title> 
        
            </head> 
        
            <body> 
        
            <form id="form1" runat="server"> 
        
            <asp:ScriptManager ID="ScriptManager1" runat="server" /> 
        
            <telerik:RadDatePicker ID="txtDiscSubStartDate" runat="server" MinDate="2006-2-1" SelectedDate="2006-04-01" /> 
        
            <br />  
        
            <telerik:RadDatePicker ID="txtDiscSubEndDate" runat="server" MinDate="2006-2-1" SelectedDate="2006-04-01" /> 
        
            <script type="text/javascript"> 
        
            Sys.Application.add_load(myFunc); 
        
            function myFunc() 
        
            { 
        
                SetMinDate(); 
        
                ShowCalendarPopup1(); 
        
            } 
        
            </script> 
        
            </form> 
        
            </body> 
        
            </html>

All the best,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

Erik Hinds

Posted on Jul 12, 2009 (permalink)

The problem with that example is that the calendars pop up when the page loads, instead of the OnClick for the controls.

I assume that this is because Sys.Application.add_load(myFunc) is executing the function.

Reply
Telerik Admin

Posted on Jul 13, 2009 (permalink)

Hello Ted,

Your assumption is correct - you will need to alter the code and determine the initial load or other custom condition inside the Sys.Application.add_load handler to prevent the ShowCalendarPopup1 method execution (if needed).

Best regards,
Sebastian
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

Reply

Not answered $find returns NULL for calendar

Products

Consulting

Purchase

Support

Community

Company