4

I'm using CKEditor in my Angular app and have a view that reloads my CKEditor instance every time users access a new model.

I'm using the following JS to initialize the editor:

var initEditor = function() {
  $('.js-editor-wrap').html("<textarea id='editor'></textarea>");

  var editor = CKEDITOR.replace('editor', {});

  editor.on('loaded', function() {
    console.log('editor loaded');
  });

  editor.on('instanceReady', function() {
    console.log('instance ready')
  });
}

And the following to destroy the editor:

var destroyEditor = function() {
  if (CKEDITOR.instances['editor']) {
    CKEDITOR.instances['editor'].destroy(true);
    $('#editor').off().remove();
  }
}

The first editor initialization works just as expected, but subsequent initializations create an editor instance with a status of "unloaded" that never triggers the "loaded" or "instanceReady" events. I'm not seeing any errors in the console.

Any ideas what might be causing this?

This is definitely a similar issue to the following, but different enough that I think it warrants its own question: CKEditor instance already exists

Community
  • 1
  • 1
Will Hitchcock
  • 4,648
  • 3
  • 22
  • 32
  • 1
    I'm guessing you have a different problem as solely the code you provided works every time like you want it to work (see this fiddle: http://jsfiddle.net/6bs3cjo8/). So it's hard to say what your specific problem may be. You could try to work around it by defining your editor instance as global variable if this is possible in your case (see this fiddle as example: http://jsfiddle.net/v0rn1Low/1/) - or a little bit nicer to return it as handle from `initEditor()` and pass it to `destroyEditor()`. – Jey DWork Mar 06 '15 at 14:53
  • Yes, I'm afraid you need to put more code - functions that call `initEditor` and `destroyEditor`. – Marek Lewandowski Mar 08 '15 at 10:32

1 Answers1

2

After a LOT more digging and thanks to the jsfiddle from Jey Dwork, I figured out where the issue is here. My CKEditor config file adds a couple of plugins that referenced lang files that were improperly named. For some reason, when these plugins were included together they caused the editor to not fully load during a second initialization.

Removing the lang files and reference to them in the plugin definitions resolved the issue. It's too bad that there wasn't some error that was triggered around this. All's well that ends well though.

Will Hitchcock
  • 4,648
  • 3
  • 22
  • 32