Geek Answers Handbook

If the content of CKEditor is modified

I am trying to find that something has changed in CKEditor using jquery but cannot make it work.

 var isModified = false;

 $('textarea,input').change(function(){
      if(!isModified){
          isModified = true;
        }
 });

$(".ckeditor").document.on('keydown', function() {  isModified = true; });

window.onbeforeunload = function(){
        $(".ckeditor").ckeditorGet().updateElement();

        if(isModified){
              return "Are you sure you want to leave page?";
           }
     };

Does anyone know what it takes to get it working on CKEditor 3.6.2? It works with all other form elements.

+5
source share
4 answers

You can track changes in the editor by attaching an editor key to the event.

Using jQuery adapter:

$('.ckeditor').ckeditorGet().on('key', function(e) {
    var keyCode = e.data.keyCode; // if you need to track the key
    isModified = true;
});

Documents for a key event

+3
source

function called checkDirty () in the CKE api for this. Thus, you do not need to roll on your own. Also comes with other useful features like resetDirty (). Try this as a test:

if ( CKEDITOR.instances.editor1.checkDirty() ) alert("Content changed");

5.7.2013

. http://dev.ckeditor.com/ticket/9794 - ! Milestone 4.2 CKSource! , .

1.8.2013

CKEditor 4.2 , onChange . -, 100% - , ! http://ckeditor.com/release/CKEditor-4.2

+29

CKEditor, , .

+1

Validating with my local Drupal installation, CKEditor is not a regular element of an HTML form (it is not a text field). Rather, it is an IFrame that mimics a form element. I think you will probably need to create a small plugin for CKEditor plugins and use this to communicate with your local scripts, see add code for the event listener to press the cceditor key .

0
source

More articles:


All Articles