Control in UpdatePanel not found using $find

2 posts, 1 answers
  1. Mike
    Mike avatar
    2 posts
    Member since:
    Sep 2013

    Posted 02 Dec 2014 Link to this post


    I have a complicated page but I created a simple ASP.NET page with the issue. I have telerik RadAsyncUpload control and a button inside an UpdatePanel as shown:
    <asp:UpdatePanel ID="_updatePanel" runat="server" UpdateMode="Conditional">
    <telerik:RadAsyncUpload ID="fileUpload" runat="server" MaxFileInputsCount="1"  OnClientFilesSelected="fileUpload_ClientFilesSelected" /><br />        
    <asp:Button ID="_saveNewFileButton" runat="server" OnClick="_saveNewFileButton_Click"<br>    Text="Save"/>

    When a file is selected I want to disable the _saveNewFileButton and change the text to "Please Wait for Attachment Upload..." but I can't seem to get hold of the button reference in javascript:

    var FilesUpdateInterval = null;
     //Handles client side FilesSelected event for _newFileUploadButton.
     function fileUpload_ClientFilesSelected(sender, args) {
        //disable the click event for submit button during upload<
         var submitButton = $find('<%= _saveNewFileButton.ClientID %>');
         submitButton.set_text('Please Wait for Attachment Upload...');
         if (FilesUpdateInterval == null) {
             FilesUpdateInterval = setInterval(function () { FileCheckForUploadCompletion(); }, 500);

    I am getting submitButton is null error. I tried putting this javascript code outside the updatepanel and inside ContentTemplate with same result. Obviously whatever I am doing is wrong. How do I get hold of the control that is in updatepanel in javascript? I appreciate any help.

  2. Answer
    Marin Bratanov
    Marin Bratanov avatar
    3555 posts

    Posted 02 Dec 2014 Link to this post

    Hello  Dana,

    The _saveNewFileButton is a standard asp:Button controls, so it renders as an input element with type=submit. So, you must use $get() or document.getElementById() to get a reference to its DOM object in order to modify it. It does not offer such rich API like our controls, so setting the text must be done via its properties. You can start off from this basic example:

    <asp:Button ID="_saveNewFileButton" runat="server" Text="Save"/>
    <script type="text/javascript">
        var submitButton = document.getElementById('<%= _saveNewFileButton.ClientID %>');
        submitButton.value = 'Please Wait for Attachment Upload...';
        submitButton.setAttribute("disabled", "disabled");


    Marin Bratanov

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

  3. DevCraft R3 2016 release webinar banner
Back to Top