Client-side Programming Overview
RadUpload has been replaced by RadAsyncUpload, Telerik’s next-generation ASP.NET upload component. If you are considering Telerik’s Upload control for new development, check out the documentation of RadAsyncUpload or the control’s product page. If you are already using RadUpload in your projects, you may be interested in reading how easy the transition to RadAsyncUpload is and how you can benefit from it in this blog post. The official support for RadUpload has been discontinued in June 2013 (Q2’13), although it is still be available in the suite. We deeply believe that RadAsyncUpload can better serve your upload needs and we kindly ask you to transition to it to make sure you take advantage of its support and the new features we constantly add to it.
RadUpload provides a flexible client-side API. You can easily interact with the RadUpload, RadProgressManager and RadProgressArea objects in the browser using their client-side objects. In addition to a variety of client-side events, the client-side object model lets you achieve tasks while avoiding the post-backs that would trigger file uploading.
Getting the client-side object
RadUpload, RadProgressManager, and RadProgressArea all create client-side objects with the ClientID of the server-side object. You can obtain a reference using the $find() method, as shown in the following JavaScript code:
var upload = $find("<%= RadUpload1.ClientID %>");
var mgr = $find("<%= RadProgressManager1.ClientID %>");
var progressArea = $find("<%= RadProgressArea1.ClientID %>");
For RadUpload, you can also use the getRadUpload() method:
var ul = getRadUpload("<%= RadUpload1.ClientID %>");
For RadProgressArea, you can also use the getRadProgressArea() method:
var pa = getRadProgressArea("<%= RadProgressArea1.ClientID %>");
For RadProgressManager, you can also use the getRadProgressManager() method:
var mgr = getRadProgressManager();
Calling client-side methods
Once you have access to a client-side object, you can use it to call its client-side methods, as shown in the following examples.
RadUpload
The following example uses the RadUpload client-side object to obtain a reference to the file inputDOM elements, and delete the row that contains them if the user has not selected a file.
function deleteUnusedFileInputs() {
var upload = $find("<%= RadUpload1.ClientID %>");
var inputs = upload.getFileInputs();
for (i = inputs.length - 1; i >= 0; i--) {
if (inputs[i].value == "")
upload.deleteFileInputAt(i);
}
}
RadProgressArea
The following example uses the RadProgressArea client-side object to cancel the current upload:
function cancelUpload() {
$find("<%= RadProgressArea1.ClientID %>").cancelRequest();
}
RadProgressManager
The following example uses the RadProgressManager client-side object to start polling for progress information:
function startPolling() {
getRadProgressManager().startProgressPolling();
}