CKEditor - attach to AJAX loaded content

1
votes

I have page that has a contenteditable area that has a CKEDitor attached.

what I'm looking to do, is to load another page to replace the current one, that loads in another contenteditable div via AJAX

This works fine, but the loaded content, doesn't have the CKEditor WYSIWYG attached.

<div contenteditable="true" class="content"></div>

 $.ajax({  
  type: "POST",                                    
  url: 'load.php',
  data: "id="+id,                        

  success: function(data)          
  {
     // I've tried using the CKEditor config, but doesn't load
  } 
});

load.php

<div contenteditable="true" class="content"></div>
1
ajaxjqueryckeditor

1 Answers

2
votes

For dynamically added elements you need to call CKEDITOR.inline. This method accepts an element (or its id) on which editor should be initialized and config object. See docs.

[added] your dynamically created div or text area 

<div contenteditable="true" id="content">...</div>

end your js with this code to attach ckeditor

CKEDITOR.inline( 'content' );