CODEWITHSUNDEEP
javascriptjqueryckeditor
Jacobian
Jacobian

Reputation: 10802

Unable to catch CKEditor change event

I looked through many threads at SO, but could not find an answer that solves my problem. So, I define a CKEditor instance like so:

var editor = $('#test-editor');

editor.ckeditor(function() {}, {
  customConfig: '../../assets/js/custom/ckeditor_config.js',
  allowedContent: true
});

However I do not know how can I catch change event. This is what I tried:

var t = editor.ckeditor(function() {
  this.on('change', function () {
    console.log("test 1"); 
  });
}, {
  customConfig: '../../assets/js/custom/ckeditor_config.js',
  allowedContent: true
}); 

editor.on('change', function() {   
  console.log("test 2"); 
});

t.on('change', function() {   
  console.log("test 3"); 
});

All these three attempts ended in failure. I should add, that I do not want to loop through all editors on a page, I just want to address one particular editor rendered at component with #test-editor. How can I do that?

Upvotes: 0

Views: 406

Answers (1)

Wizard
Wizard

Reputation: 3151

The jQuery ckeditor() method returns a jQuery object, which exposes only 5 events of CKEditor in its event handling. In order to use other events, you need to use the CKEditor.editor object by accessing the editor property of the jQuery object.

So, you need to use something like this:

var myeditor = $('#test-editor').ckeditor({
    customConfig: '../../assets/js/custom/ckeditor_config.js',
    allowedContent: true
});
myeditor.editor.on('change', function(evt) {
    console.log('change detected');
});

Upvotes: 1

Related Questions