CKEditor And Box window Note

C KEditor And Box window Note

1 . open a new page

if( CKEDITOR.instances[element_id] )

# it will delete the CKEDITOR old instance from cache but it won't  remove the CKEDITOR DOM

(Because the new page has no CKEDITOR DOM, so we needn't destroy it, just use remove. If you use destroy method, it will produce a bug! )

CKEDITOR.remove(CKEDITOR.instances[element_id]) ;

CKEDITOR.replace(element_id, options)

2. create a ckeditor and destroy it in one page

CKEDITOR.replace(element_id, options)

CK EDITOR .instances[element_id]) .destroy() # it will remove the CKEDITOR DOM

3. In Chrome

When you use ckeditor in chrome, you should remember create ckeditor after box resized.

1) create a ckedtior in a new popup window

you should run the create ckeditor code on popup window event : on_complete

CK_Reload = function() {if (CKEDITOR.instances['#{element_id}']) {         CKEDITOR.remove(CKEDITOR.instances['#{element_id}']);}         CKEDITOR.replace('#{element_id}', { #{ckeditor_applay_options(ckeditor_options)} });return '#{element_id}';}

I run CK_Reload in on_complete event.

2) re-create a ckeditor in popup window

you should run the re-create ckeditor code after popup window resized.

_ error.js.erb

var content = ''; var element_id = ''; for (instance in CKEDITOR.instances){   element_id = instance;   content = $('#'+instance).val(); //get old data } $.colorbox.resize(); CKEDITOR.instances[element_id].destroy(); CKEDITOR.replace(element_id, <%=load_ckeditor_options %>); CKEDITOR.instances[element_id].setData(content);

3) If you use box resize method:

• you can't edit ckeditor. You should re-create a new ckeditor or you use CKEDITOR.instances[element_id].setData(old_data) .

• If you want to ckeditor use textarea value, you should re-create a new ckeditor before resize.

• If you resize the box window,  a new cked itor can't get data from textarea.

• Or you can use CKEDITOR.instances[eleme nt_id].setData(content) to set ckeditor value after resize.
  

4. In firefox

1) If you use box resize method:

• you can use ckeditor
• If you want to ckeditor use textarea value, you should re-create a new ckeditor before resize.
• If you resize the box window,  a new ckeditor can't get data from textarea.
  
• Or you can use CKEDITOR.instances[element_id].setData(content) to set ckeditor value after resize.