Error CKEditor + IE7 + 8 'null or not an object'

Question

My problem is that I am using the CKEditor 3.4 plugin for jQuery and this gives me an error in IE 7 + 8 when making a call to $ (selector) .val (html) in the editor:

Error: 'this. $. innerHTML 'is null or not an object

... which, when launched in the debugger, points to this line of code in the huge CKEditor.js:

getHtml:function(){var i=this.$.innerHTML;return c?i.replace(/<\?[^>]*>/g,''):i;} 

... which corresponds to this in the source:

 getHtml : function() { var retval = this.$.innerHTML; // Strip <?xml:namespace> tags in IE. (#3341). return CKEDITOR.env.ie ? retval.replace( /<\?[^>]*>/g, '' ) : retval; }, 

My violation code (truncated but still throwing an error):

 var editor_data = $("textarea#body").val(); $("textarea#body").val(editor_data); 

... and the textarea code for posterity:

 <textarea name="body" rows="15" cols="50" class="wysiwyg" id="body"></textarea> 

I tried to play in jsFiddle in IE8, but it is strange that it works as intended. I would also like to provide a working sample, but, unfortunately, I can’t for reasons beyond my control.

I also tried this fix and it fixed the problem with the error, but after that setData did not work properly and just rewrote the contents of the editor with nothing. I admit that this problem + fix is ​​a little over my head ...: http://dev.ckeditor.com/ticket/4566

(Sorry, long post: S) I also tried using the direct JavaScript API in CKEditor (abandon jQuery integration) and it threw the same error.

Anyone have anything that they would like me to try to fix this problem or have any problems? It would be very grateful!

Answer 1

Personally, I am not a fan of the existing answer, which is to change the source code, because as soon as you update ckEditor, you should remember to change the source again. I had the same problem as the original poster, and found a fix that is considered a hack, but fully usable. Just Try / Catch made everything pleasant and happy in IE8. Now test in IE7. Another bonus of this fix is ​​that you are not left with blank data when it crashes, but you get the actual content that you tried to extract.

 var editor = $('textarea.editor').ckeditorGet(); var vPageContent = ""; try{ vPageContent = editor.getData();//function call fails here } catch(err){ vPageContent = editor.getData();//but will work here } 

Answer 2

This may not be the best solution, but take a look at this: http://dev.ckeditor.com/ticket/4566

It is alleged that the replacement

 getHtml:function(){var i=this.$.innerHTML;return c?i.replace(/<\?[^>]*>/g,''):i;}, 

from

 getHtml:function(){return (this.$) ? this.$.innerHTML : "";}, 

will solve the problem.

I am not saying that this is the correct answer, but today I have the same problem and (at the moment) seems to work.

Answer 3

be careful with the extra comma. IE does not like exra commas. You can check your code for json lint extra comma