Edit this page

Client-Side Events Overview

RadImageEditor provides a rich set of client-side events which allow easy and flexible use in a wide range of application scenarios. Many of the events are cancelable giving you the possibility to cancel any operation performed on the image:

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.

<telerik:RadImageEditor RenderMode="Lightweight" runat="server" ID="RadImageEditor1" OnClientLoad="OnClientLoad"></telerik:RadImageEditor>
<script type="text/javascript">
    function OnClientLoad(sender, eventArgs)
    {
        alert("OnClientLoad event fired by RadImageEditor with ID: " + sender.get_id());
    }
</script>

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:

function addEvents()
{
    var radImageEditor1 = $find("<%= RadImageEditor1.ClientID%>");
    radImageEditor1.add_commandExecuting(function1);
    radImageEditor1.add_commandExecuting(function2);
}

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

function removeEvents()
{
    var radImageEditor1 = $find("<%= RadImageEditor1.ClientID%>");
    radImageEditor1.remove_commandExecuting(function1);
}

Here is a list with the available methods to attach or detach event handlers:

Name Description
add_load Adds a handler to the OnClientLoad event
remove_load Removes a handler from the OnClientLoad event
add_commandExecuting Adds a handler to the OnClientCommandExecuting event
remove_commandExecuting Removes a handler from the OnClientCommandExecuting event
add_commandExecuted Adds a handler to the OnClientCommandExecuted event
remove_commandExecuted Removes a handler from the OnClientCommandExecuted event
add_imageChanging Adds a handler to the OnClientImageChanging event
remove_imageChanging Removes a handler from the OnClientImageChanging event
add_imageChanged Adds a handler to the OnClientImageChanged event
remove_imageChanged Removes a handler from the OnClientImageChanged event
add_resizeStart Adds a handler to the OnClientResizeStart event
remove_resizeStart Removes a handler from the OnClientResizeStart event
add_resizeEnd Adds a handler to the OnClientResizeEnd event
remove_resizeEnd Removes a handler from the OnClientResizeEnd event
add_saving Adds a handler to the OnClientSaving event
add_shortCutHit Adds a handler to the shortCutHit event
remove_saving Removes a handler from the OnClientSaving event
remove_shortCutHit Removes a handler from the shortCutHit event
add_saved Adds a handler to the OnClientSaved event
remove_saved Removes a handler from the OnClientSaved event
add_toolsDialogClosed Adds a handler to the OnClientToolsDialogClosed event
remove_toolsDialogClosed Removes a handler from the OnClientToolsDialogClosed event

See Also