Is it possible to click on the crop button without the crop form window opening ?

[Thor]

Is it possible to click on the crop button without the crop form window opening, but that you can crop and then have another save changes button, preferably under images where you crop ?

Need the same function for the Save button also, I just want the save button to go to code behind and I will do the saving :-)

[Vasko]

Hi Thor,

You can remove the crop/save popup window by setting it's display CSS property to false:

<style>
    #RadImageEditor1_ToolsPanel {
        display: none !important;
    }
</style>

Now only the crop dimensions will be shown, and they will be needed for the x/y position, as well as the width/height of the crop area: 

<telerik:RadImageEditor ID="RadImageEditor1" runat="server" ImageUrl="images.jpg">
    <Tools>
        <telerik:ImageEditorToolGroup>
            <telerik:ImageEditorTool CommandName="Crop" />
            <telerik:ImageEditorTool CommandName="Save" />
        </telerik:ImageEditorToolGroup>
    </Tools>
</telerik:RadImageEditor>

<telerik:RadButton runat="server" ID="RadButton1" Text="Crop" AutoPostBack="false" OnClientClicked="OnClientClicked" />

<script>
    function OnClientClicked(sender, args) {
        var imgEditor = $find("<%= RadImageEditor1.ClientID %>");
        imgEditor.getEditableImage().crop(collectBounds());
    }

    function collectBounds() {
        var imgEditor = $find("<%= RadImageEditor1.ClientID %>");
        var draggableResizeBox = document.querySelector(".rieDraggableResizeBox")

        if (draggableResizeBox) { // Crop only if the crop box is selected
            var xPos = parseInt(draggableResizeBox.style.left.replace("px", "")); // Parse the values to numbers
            var yPos = parseInt(draggableResizeBox.style.top.replace("px", ""));
            var width = parseInt(draggableResizeBox.style.width.replace("px", ""));
            var height = parseInt(draggableResizeBox.style.height.replace("px", ""));

            if (isNaN(xPos) || isNaN(yPos) || isNaN(width) || isNaN(height)) {
                return false;
            }

            return new Sys.UI.Bounds(xPos, yPos, width, height); // The ImageEditor expects certain bounds to be applied when attempting to crop, and the values are from the draggableResizeBox itself
        }
    }
</script>

I hope this helps.

Kind regards,
Vasko
Progress Telerik