This is a migrated thread and some comments may be shown as answers.

Control in UpdatePanel not found using $find

1 Answer 156 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Mike
Top achievements
Rank 1
Mike asked on 02 Dec 2014, 03:23 PM
Hi,

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">
<ContentTemplate>
    ...
<telerik:RadAsyncUpload ID="fileUpload" runat="server" MaxFileInputsCount="1"  OnClientFilesSelected="fileUpload_ClientFilesSelected" /><br />        
    
<asp:Button ID="_saveNewFileButton" runat="server" OnClick="_saveNewFileButton_Click"<br>    Text="Save"/>
 
</ContentTemplate>
</asp:UpdatePanel>

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...');
     submitButton.set_readOnly(true);
     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.

Thanks,
Dana

1 Answer, 1 is accepted

Sort by
0
Accepted
Marin Bratanov
Telerik team
answered on 02 Dec 2014, 05:32 PM

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");
</script>



Regards,

Marin Bratanov
Telerik
 

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.

 
Tags
General Discussions
Asked by
Mike
Top achievements
Rank 1
Answers by
Marin Bratanov
Telerik team
Share this question
or