CKeditor in iframe, from parent = q is null

[Angel Cervera Claudio]

When replace a div in a iframe with a ckeditor component, from parent it is retrieve "q is null" error in firefox and "Uncaught TypeError: Cannot call method 'setHtml' of null" in Chrome.

Test with ckeditor 3.5 and jquery 1.4.4. Error is produced with and without ckeditor jquery adapter.

I attach a simple example.

For better test and prevent security errors in some browsers, deploy example in a web server (for example, Apache).

[Angel Cervera Claudio]

Simple example for test.

[Alfonso Martínez de Lizarrondo]

You must add the CKEditor files to the page being edited, not to the parent.

[Angel Cervera Claudio]

It is evidence that if i include ckeditor and other javascript inside iframe, it will work, but i can't modify iframe content file.

[Alfonso Martínez de Lizarrondo]

Although you might not be able to edit the source file, you should be able to inject the js file on the fly from the parent. Or you can perform some other tricks, there are several things that you could do to carry out this task.

[Angel Cervera Claudio]

Yes, there are a lot of tricks to apply, but i thought that this feature was supported. We are replacing other WYSIWYG javascript editor with ckeditor, but this limitation is huge.

So if it is not a bug, could be a new feature? Or never will be support this feature?

Thanks.

[Alfonso Martínez de Lizarrondo]

I would call this a huge limitation as I've never seen this kind of request before.

As I said it's quite easy for you to write a little wrapper that injects the CKEditor script into the iframe and creates the editable elements, also you'll have to add some custom code in order to read back the changes that you want to save. That kind of code is too customized in order to be integrated as a default option because it would mean extra things to check from now on and no one else would take advantage of having it in the core, on the opposite it would mean some extra Kb that aren't needed.

[Kevin Kamel]

Request seconded - I've been trying to figure out how to get this working elegantly for a few weeks. There are no "good" solutions unfortunately.

Basically what I have is a jquery web based application bound to a page with an iframe holding a web page that the user edits. JQuery is bound to click events on various editable zones within the target iframe, which right now invokes a dialog to contain ckeditor.

It would be much much nicer if I could use the shared spaces feature in combination with a replace call on the target divs instead of needing the popup dialog.

It's not clear how many people would use it, but anyone who is doing full webpage development via ckeditor would need to be using an iframe in order to ensure that external styles did not cascade into their work.