Getting current instance of Inline CKEditor in plugin command

Question

We recently moved away from tinymce, and a custom function we created there was a toolbar button that, once clicked, slid up a custom div right above the toolbar, which was appended to the toolbar on page load.

The problem now is doing the same for CKEditor when using the Inline version. Since there are a dozen of instances active at any one time, how can I fetch the instance of the current popped up inline Ckeditor so that I can append to it with jQuery, after the custom plugin button has been clicked?

Using the latest version 4.x of CKEditor.

oleq · Accepted Answer · 2013-02-05 23:02:06Z

8

It's hard to imagine what you're trying to accomplish. Anyway, you can observe which editor instance is focused (you can eventually store a reference in some variable):

CKEDITOR.on( 'instanceReady', function( event ) {
    event.editor.on( 'focus', function() {
        console.log( 'focused', this );
    });
});

After all, you can also browse editor instances since they are stored in CKEDITOR.instances object in global namespace. With this, you can find your instance by name, id, anything (i.e. previously associated with your button).

edited Feb 5, 2013 at 23:02

answered Feb 5, 2013 at 16:21

oleq

15.9k1 gold badge40 silver badges69 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Nick Zinger Over a year ago

This is exactly what I needed, thanks! (the focusedInstance variable is undefined though). I'm trying to avoid using the CKEditor dialog, so the edited text doesn't get covered by it while using the plugin to insert certain text. I think this should work, so I'll accept as soon as possible.

oleq Over a year ago

Fixed missing variable. Replied in hurry ;-)

Wayne Smallman Over a year ago

I was in need of the exact same thing, so that I could make the save button appear only when the focus is on the editor.

Michael M. · Accepted Answer · 2023-02-16 19:08:49Z

3

I'd do it like this

var ck_instance_name = false;
for ( var ck_instance in CKEDITOR.instances ){
    if (CKEDITOR.instances[ck_instance].focusManager.hasFocus){
        ck_instance_name = ck_instance;
        return ck_instance_name;
    }
}

edited Feb 16, 2023 at 19:08

Michael M.

11.2k11 gold badges22 silver badges46 bronze badges

answered Sep 5, 2013 at 13:51

Jimmy Kane

16.9k12 gold badges93 silver badges121 bronze badges

1 Comment

Francesco Marchetti-Stasi Over a year ago

This should be the accepted answer: tracking the focus on the instances like other answers suggest is really useless, given the fact that Ckeditor itself knows which editor has the focus. Of course after ten years the code can be revanoed, but that's beyond the point.

Brad Larson · Accepted Answer · 2014-08-20 22:18:39Z

1

Get current instance of ck editor. Here is simple code

var currentEditor;    
 for(var id in CKEDITOR.instances) {
  CKEDITOR.instances[id].on('focus', function(e) {
    // Fill some global var here
    currentEditor = e.editor.name;
});
}

edited Aug 20, 2014 at 22:18

Brad Larson

170k45 gold badges401 silver badges574 bronze badges

answered Jun 26, 2014 at 4:23

Shafiqul Islam

5,6852 gold badges36 silver badges45 bronze badges

Comments

Rashad · Accepted Answer · 2014-03-23 04:38:48Z

0

Using the accepted answer above I found that the editor "name" (as it's known) of the editor instance that triggered the given plugin is accessible via this._.editor.name (using CKEditor v4.3)

As such you can retrieve the editor content in this manner.

CKEDITOR.instances[this._.editor.name].getData();

edited Mar 23, 2014 at 4:38

Rashad

11.2k5 gold badges50 silver badges73 bronze badges

answered Mar 23, 2014 at 4:16

Michael W

1

Collectives™ on Stack Overflow

Getting current instance of Inline CKEditor in plugin command

4 Answers 4

3 Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related