Getting and using data from CKEditor?

JavaScript
1

Hey guys, i’m trying to use CKEditor for people to enter text in and ill use the text to put it in a database and show them what they typed. How would i do this with Jquery? I know that using the .getData() gets you the text, but i want to take that text and append it to a <p> tag so that the user can see what they typed. Also, how could it be made to update on the .keyup function?

I have the code to make it show up in the <p> tag:


var editor = CKEDITOR.replace('editor');
var editor_data = editor.getData();

 $('p.new-content').text(editor_data);

but i can’t seem to make it update at all. What could be a good solution for this?

2

Hi,

Could you post a link to a demo page that includes the CKEditor?
That way I can play around with it and try and help you solve your problem.

3

here’s the demo link: http://ckeditor.com/demo

4

Ok, thanks.

It turns out that there’s no default event fired whenever something changes in CKEditor, but it’s possible to extend the CKEditor API and add this functionality.
Here’s a blog post with a working demo that does what you want: http://alfonsoml.blogspot.com.es/2012/05/recipe-live-preview-of-ckeditor.html

Hope that helps.
Let me know if you run into any trouble.

5

perfect! thank you!!