Javascript $find function

[Michael Dunbar]

Hi,

Bit of a long shot this, but here we go. It's more of a generic Javascript issue than a problem with the Telerik controls, although I am using the controls.

I have a problem where when I try to $find a telerik control in an ASP.NET user control it is always returned as null. However, if I $get this control using the same ID then a HTML Input Object is returned. I've tried using the $find function on a stand alone page and it works fine with either:

var control = $find("controlID")

or

var control = $find('<%= controlID.ClientID %>');

The ID of the control I am looking for is rendered like this in the HTML:

ctl00_ucRTKTemplate_ctl04_ctl00_cmFileView

ucRTKTemplate being an ASP.NET user control that loads another ASP.NET user control that contains the Telerik context menu I am attempting to find. If I type the above ID directly into the $find function then I do find the control, but obviously I would like to be able to find this control dynamically.

Any ideas?

Thanks,

Michael

[Dimo]

Hi Michael,

Probaly you are trying to obtain a reference to the control client object with $find() too early, before the object  has been initialized. That's why $get() returns a value, while $find() does not.

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

You might also want to try a Telerik productivity tool - JustCode. It’s a Visual Studio add-in that offers advanced JavaScript code navigation, refactorings, quick fixes and code analysis features which  can help you be more productive writing JavaScript code. What’s more JustCode can be used for multi-language solutions, as it also provides features for C#, VB.NET, ASP.NET, XAML and HTML.

Kind 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.

[Michael Dunbar]

Thanks Dimo. I do have one eye on the life cycle of my application for this, but I am not yet convinced that is the issue. I'll have a read of that article.

I am firing the Javascript event on double click of a RadGridRow.

[Dimo]

Hello again,

Well, feel free to send us a runnable example in case you think there is a problem with RadControls.

Greetings,
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.

[Michael Dunbar]

I don't think that is necessary. I was rather hoping I had just done something wrong in my Javascript, it not being my strongest language.

Can you find a control and then loop through that control in Javascript to find what control you want? I think the issue lies around me nesting a user control in another user control. If I manually enter the IDs of the controls then all my script starts working, so I must be confusing it with IDs basically.

[Michael Dunbar]

Interestingly, I can get the following id with this bit of script:

// Gets the ASP.NET generated control ID
function GetClientId(controlId) {
    var count = document.forms[0].length;
    var i = 0;
    var aspControlId;
    for (i = 0; i < count; i++) {
        aspControlId = document.forms[0].elements[i].id;
        pos = aspControlId.indexOf(controlId);
        if (pos >= 0) break;
    }
    return aspControlId;
}

ctl00_ucRTKTemplate_ctl04_ctl00_cmFileView_ClientState

Is the ClientState bit at the end making it invalid?

[Atanas Korchev]

Hello Michael Dunbar,

Using $find("<%= SomeControl.ClientID %>") is the recommended way to get reference to client-side objects. What it does it to output the generated client-id in the final markup of your page.
The $find() routine may fail in the occasion when the control is not yet initialized. All ASP.NET Ajax controls are initialized when the page is fully loaded - the required initialization statements are output at the end of the page just before closing the form tag. This means that the following will not work as the client-side object is not initialized:

<telerik:RadMenu runat="server" id="RadMenu1" />

<script type="text/javascript">
var menu = $find("<%= RadMenu1.ClientID%>"); // menu will be null here
</script>

The workaround here is to register your code after control initialization. This can be done in the following ways:

1. Define a pageLoad method JavaScript method which is called on initial load and after ajax updates.
2. Subscribe to the load event of the Sys.Application javascript object. The pageLoad method mentioned earlier is just a shortcut to this event
3. Use window.setTimeout. This would just delay the execution of your code and may need tweaking to find the timeout which works.

In your case it would be best to use the load event of the application. Emit that script using ScriptManager.RegisterStartupScript method. You can find examples in this forum thread.

I hope this helps,
Albert
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.

[sp]

Hi,

I am trying to deploy my application from my development machine to our test server. The application works well on my development machine but it throws a sys.argumentnullexception:Value cannot be null. Parameter name:id Javascript error.
The error is after 
var MasterTable = grid.get_masterTableView();  in the ExpandPane(sender, eventArgs) function. The radgrid is being databound in button1_click event during postback
 I have attached my code here. Only difference between my development machine and test server is Telerik Controls are not installed on the test server. Is it necessary to install the controls? Thanks.

 

[sp]

I was able to reproduce this scenerio on one of our spare machine. Here is what I did on that:
I installed telerik controls and my application started working without the javascript errors. Out of curiosity I then uninstalled telerik controls from the machine. My application still works without issues.
Thats make me think that its not the install per se, but during the install telerik is making some setting change which was missing earlier. Anybody have any idea what this could be? I will have to do it manually on our test server because I cannot install/uninstall telerik controls on that machine.
Also, the version I installed was 2009 Q1(without the SP) so I had to go through the step of reinstalling SMdiagnostics.dll and System.Runtime.Serialization.dll in the GAC. Could this have fixed the issue?
Thanks.

[Oscar]

try

var control = Document.GetElementsByID("ControlID")

work for me

[Phil]

@Oscar

var control = document.getElementById("<%= ControlID.ClientID %>");

;)