Search code examples
javascriptckeditordom-eventsinternet-explorer-9copy-paste

CKEditor: capturing on paste event (including Shift + Insert)


We are using CKEditor and we are handling the paste event like such:

var editor = CKEDITOR.instances.OurInputControlName;
editor.on('paste', function(ev) {
    alert('we are in the on paste event!');
}

However, I have just discovered that users are able to paste by pressing Shift+Insert and our paste event handler is not being executed.

How can I add an event handler that captures Shift+Insert and pasting.

We're on CKEditor 4.1.1.

Edit: This might be an IE only problem, IE9 at least. I am yet to try other versions of IE. It works fine in Firefox and Chrome.


Solution

  • I fixed this issue by detecting when Shift+Insert was pressed in IE and manually firing the paste event.

    var editor = CKEDITOR.instances.OurInputControlName;
    editor.on('key', function(ev) {
        if (ev.data.keyCode == 2228269 && $.browser.msie) {
            setTimeout(function() {
                var event = {
                    'type': 'html',
                    'dataValue': editor.getData()
                };
                editor.editable().setHtml('');
                editor.fire('paste', event);
            }, 100);
        }
    });
    editor.on('paste', function(ev) {
        alert('we are in the on paste event!');
    }
    

    I am using setHtml() as calling editor.setData('') kept logging a Javascript error in the console (even though it did seem to clear the textarea and did not stop the page working).