onClick event on fileButton causes an error after upload for minified version

[Brett Profitt]

When uploading an image through the Image plugin with a custom filebrowserUploadUrl set, the following code causes an error (Uncaught TypeError: Cannot read property 'getDialog' of undefined on ckeditor.js:689) ONLY with the minified version:

CKEDITOR.on('dialogDefinition', function (ev) {
        var dialogName = ev.data.name;
        var dialogDefinition = ev.data.definition;

        if (dialogName === 'image') {
                var uploadTab = dialogDefinition.getContents('Upload');

                for (var i = 0; i < uploadTab.elements.length; i++) {
                        var el = uploadTab.elements[i];

                        if (el.type !== 'fileButton') {
                                continue;
                        }

                        el.onClick = function() {
                                console.log('click');
                        };
                }
        }
});

The error doesn't occur until after the server replies. This is what the reply looks like (with variables set correctly):

<script type='text/javascript'>window.parent.CKEDITOR.tools.callFunction($ckeditor_func_num, '{$params['url']}');</script>

[Jakub Ś]

Could you send us simplified version of this custom upload code?

Please also make sure that response is returned in accordance with ​http://docs.cksource.com/CKFinder_2.x/Server_Side_Integration/The_Commands/FileUpload

[Brett Profitt]

I'm not using FileUpload. I'm implementing the File Browser API as described here: ​http://docs.ckeditor.com/#!/guide/dev_file_browser_api

Here's a simplified version of the PHP code used to handle uploads:

$ckeditor_func_num = $_GET['CKEditorFuncNum'];

if ($_FILES['upload']['error'] === UPLOAD_ERR_OK) {
        if (move_uploaded_file($_FILES['upload']['tmp_name'], '/tmp/upload_test')) {
                // a static file
                $url = "http://localhost/example_file.png";
                echo "<script type='text/javascript'>window.parent.CKEDITOR.tools.callFunction($ckeditor_func_num, '$url');</script>";
        } else {
                echo "<script type='text/javascript'>window.parent.CKEDITOR.tools.callFunction($ckeditor_func_num, '', 'Error moving file.');</script>";
        }
} else {
        echo "<script type='text/javascript'>window.parent.CKEDITOR.tools.callFunction($ckeditor_func_num, '', 'Error uploading file.');</script>";
}

exit;

[Brett Profitt]

I tracked this down to the difference in bind order when using minified vs non-minified versions stemming from how the plugins are loaded in the non-minified version. If you attach an onClick event handler to the fileButton input element, you need to call any existing event handlers.

Closing because I don't think there's anything that can be done in CK Editor to alleviate that.

[Jakub Ś]

Thanks for letting us know.

If you attach an onClick event handler to the fileButton input element, you need to call any existing event handlers.

Could you perhaps try using this method: ​http://docs.ckeditor.com/#!/api/CKEDITOR.ui.dialog.uiElement-method-registerEvents. Perhaps it will solve your issue?

[Jérôme BLONDON]

Hi, i was facing the same problem.

As a workaround i have directly put my custom buttons in the link plugin and re-minified my custom version with ckbuilder.