| 1 | <!DOCTYPE html> |
|---|
| 2 | <html> |
|---|
| 3 | <head> |
|---|
| 4 | <title></title> |
|---|
| 5 | <script type="text/javascript" src="/ckeditor/ckeditor_source.js"></script> |
|---|
| 6 | <script> |
|---|
| 7 | function doStuff(){ |
|---|
| 8 | document.getElementById('asd').innerHTML = ''; |
|---|
| 9 | getData(); |
|---|
| 10 | if(editor){ |
|---|
| 11 | editor.destroy(); |
|---|
| 12 | editor = null; |
|---|
| 13 | } |
|---|
| 14 | |
|---|
| 15 | } |
|---|
| 16 | /** |
|---|
| 17 | * load the editor again. It still shouldn't work. |
|---|
| 18 | * |
|---|
| 19 | */ |
|---|
| 20 | function loadEditor(){ |
|---|
| 21 | if(!editor){ |
|---|
| 22 | editor = CKEDITOR.appendTo('asd', null ,'initial text'); |
|---|
| 23 | editor.on('blur', getData); |
|---|
| 24 | } |
|---|
| 25 | } |
|---|
| 26 | |
|---|
| 27 | function getSomeData(){ |
|---|
| 28 | alert(editor2.getData()); |
|---|
| 29 | } |
|---|
| 30 | |
|---|
| 31 | function setSomeData(){ |
|---|
| 32 | alert('setting the data to "setting some data"'); |
|---|
| 33 | editor2.setData('Setting some data'); |
|---|
| 34 | } |
|---|
| 35 | /** |
|---|
| 36 | * handles onblur event. |
|---|
| 37 | * |
|---|
| 38 | */ |
|---|
| 39 | function getData(){ |
|---|
| 40 | if(console){ |
|---|
| 41 | console.log('blurring.'); |
|---|
| 42 | } |
|---|
| 43 | |
|---|
| 44 | if(editor){ |
|---|
| 45 | document.getElementById('theData').innerHTML = editor.getData(); |
|---|
| 46 | } |
|---|
| 47 | |
|---|
| 48 | if(editor2){ |
|---|
| 49 | document.getElementById('theData2').innerHTML = editor2.getData(); |
|---|
| 50 | } |
|---|
| 51 | } |
|---|
| 52 | </script> |
|---|
| 53 | </head> |
|---|
| 54 | <body> |
|---|
| 55 | <div> |
|---|
| 56 | <h2>step's to repoduce</h2> |
|---|
| 57 | <ol> |
|---|
| 58 | <li>Click on the break it button.</li> |
|---|
| 59 | <li>Notice that you get an js error saying that $.contentWindow is null. That is because I killed it.</li> |
|---|
| 60 | <li>Got to second editor (editor2) type and blur. This should update the div with whatever you typed you will notice that it does not update it with what you typed in.</li> |
|---|
| 61 | </ol> |
|---|
| 62 | |
|---|
| 63 | <h2>Explaination</h2> |
|---|
| 64 | <p> |
|---|
| 65 | isHandlingData is set to true because of the error that was thrown. No one would kill the editor and then get the data but in my case this was a race condition. |
|---|
| 66 | the blur event would get the data and sometimes the blur would happen after the html was destroyed. I force the issue here to facilitate the error. |
|---|
| 67 | </p> |
|---|
| 68 | <p> |
|---|
| 69 | After the error. all of the getData() and setData() calls don't update the iframe. It skips that part because of the initial error. You can test this by clicking the call to "set data on editor2" and "get the data on editor2". |
|---|
| 70 | </p> |
|---|
| 71 | </div> |
|---|
| 72 | |
|---|
| 73 | |
|---|
| 74 | <div id="asd"></div> |
|---|
| 75 | <input type="button" onclick="doStuff()" value="break it" /> |
|---|
| 76 | |
|---|
| 77 | <div id="editor2"></div> |
|---|
| 78 | |
|---|
| 79 | <script> |
|---|
| 80 | |
|---|
| 81 | var editor = CKEDITOR.appendTo('asd', null ,'initial text'); |
|---|
| 82 | var editor2 = CKEDITOR.appendTo('editor2'); |
|---|
| 83 | editor.on('blur', getData); |
|---|
| 84 | editor2.on('blur', getData); |
|---|
| 85 | </script> |
|---|
| 86 | |
|---|
| 87 | <div id="theData"></div> |
|---|
| 88 | <div id="theData2"></div> |
|---|
| 89 | |
|---|
| 90 | |
|---|
| 91 | <input type="button" onclick="loadEditor()" value="reloadEditor" /> |
|---|
| 92 | <input type="button" onclick="setSomeData()" value="call set data on editor 2" /> |
|---|
| 93 | <input type="button" onclick="getSomeData()" value="call get data on editor 2" /> |
|---|
| 94 | </body> |
|---|
| 95 | </html> |
|---|
