• OnClientAdding occurs when a row is about to be added to the RadUpload control.

• OnClientAdded occurs when a row has just been added to the RadUpload control.

• OnClientClearing occurs when a file input control is cleared.

• OnClientDeleting occurs when a row is about to be deleted.

• OnClientDeletingSelected occurs when all selected rows are about to be deleted.

• OnClientFileSelected occurs when a file is selected in a file input control: either when the control loses focus after the user types in a value, or when the user selects a file using the browser.

• OnClientProgressUpdating occurs immediately before the text indicators in the RadProgressArea dialog are updated.

• OnClientProgressBarUpdating occurs immediately before one of the progress bars in the RadProgressArea dialog is updated.

• OnClientProgressUpdating occurs immediately before any RadProgressArea dialogs on the page are updated.

• OnClientProgressStarted occurs when the progress manager starts monitoring the progress of a file upload operation.

• OnClientSubmitting occurs when a postback that uploads files is about to occur.

To use these events, simply write a javascript function that can be called when the event occurs. Then assign the name of the javascript function as the value of the the corresponding property:

CopyASPX

<script type="text/javascript">
    function confirmDeletes(sender, eventArgs) {
        if (!confirm("Are you sure you want to delete the selected row?"))
            eventArgs.set_cancel(true); 
    }
    // #region client-side-events_1

    function onAddedHandler1() {
        alert("First handler called");
    }

    function onAddedHandler2() {
        alert("Second handler called"); 
    }

    function pageLoad() {
        var upload = $find("<%= RadUpload1.ClientID %>");
        upload.add_added(onAddedHandler1);
        upload.add_added(onAddedHandler2); 
    }

    // #endregion

    // #region client-side-events_2

    function removeOnAdded2() {
        var upload = $find("<%= RadUpload1.ClientID %>");
        upload.remove_added(onAddedHandler2); 
    }

    // #endregion
</script>
<telerik:radupload id="RadUpload1" runat="server" onclientdeletingselected="confirmDeletes"></telerik:radupload>

You can also assign event handlers in client-side code. When using the client-side API, pass a reference to the event handler rather than its name. One advantage of using the client-side API is that you can attach multiple event handlers to one event using the standard MS AJAX convention:

CopyJavaScript

function onAddedHandler1() {
    alert("First handler called");
}

function onAddedHandler2() {
    alert("Second handler called"); 
}

function pageLoad() {
    var upload = $find("<%= RadUpload1.ClientID %>");
    upload.add_added(onAddedHandler1);
    upload.add_added(onAddedHandler2); 
}

Another advantage of the client-side API is that you can detach an event handler dynamically:

CopyJavaScript

function removeOnAdded2() {
    var upload = $find("<%= RadUpload1.ClientID %>");
    upload.remove_added(onAddedHandler2); 
}

Note that on the client-side, the names of events are slightly different than on the server side. The following table shows the correspondance between client-side and server-side names:

Other Resources