Jquery – Using jQuery to grab the content from CKEditor’s iframe


I have a custom-written CMS that uses CKEditor *(FCKEditor v3) for editing content. I'm also using the jQuery Validation plugin to check all fields for error prior to AJAX-based submission. I'm using the serialize() function to passing the data to the PHP backend.

Problem is, serialize manages to grab all fields correctly, except for the actual content typed in CKEditor. Like every other WYSIWYG editor, this one too overlays an iframe over an existing textbox. And serialize ignores the iframe and looks only into the textbox for content, which, of course, it doesn't find, thus returning a blank content body.

My approach to this is to create a hook onto the onchange event of CKEditor and concurrently update the textbox (CKEDITOR.instances.[textboxname].getData() returns the content) or some other hidden field with any changes made in the editor.

However, since CKEditor is still in it's beta stage and severely lacks documentation, I can't find a suitable API call that'll enable me to do so.

Does anyone have any idea on how to go about this?

Best Answer

Another generic solutions to this would be to run the following whenever you try to submit the form

for ( instance in CKEDITOR.instances )

This will force all CKEDITOR instances in the form to update their respective fields