CODEWITHSUNDEEP
javascriptckeditor
Shane Reustle
Shane Reustle

Reputation: 8952

How to properly destroy CKEditor instance?

I am running CKeditor 3.4 on a pretty simple page. I am having a problem (sometimes) where when I call document.main_form.submit(), it will not send along the contents of the textarea. After some reading, it sounds like CKeditor is not destroying properly. I tried to manually destroy it before I save the form, but wasn't able to call it. The weird thing is, it works sometimes, but not others. I'm on Chrome, so that may be screwing with things, but the same thing happens in Firefox.

How can I properly destroy the CKeditor so that it always sends the textarea data in POST. Thanks!

Upvotes: 32

Views: 66503

Answers (7)

ashish naghate
ashish naghate

Reputation: 71

for(name in CKEDITOR.instances){ CKEDITOR.instances[name].destroy() }

Use to code to destroy all the instances created by ckeditor

Upvotes: 6

Will Berger
Will Berger

Reputation: 1

the solution that finally did work.

The issue was if you destroy a ckeditor and the subsequently try to replace a textarea that does not work.

I found this simple example that gave me the clue. Use div and append the ckeditor instead of using replace api call

http://ckeditor.com/latest/samples/old/ajax.html

<div id='emailEditor1'>
              </div>

function closeTab() {
    emailEditor1.destroy();
    emailEditor1 = null;
}

function createEditor() 
    if (emailEditor1 == null) {
        emailEditor1 = CKEDITOR.appendTo( 'emailEditor1');
    }
}

Upvotes: -1

Sandeep Sherpur
Sandeep Sherpur

Reputation: 2802

use this simple code.Note my text area id is editor1.
or You can also check it with console.log(CKEDITOR.instances.editor1);

if (CKEDITOR.instances.editor1) {
     CKEDITOR.instances.editor1.destroy();
}

Upvotes: 6

shobhit pokhriyal
shobhit pokhriyal

Reputation: 1

$this->widget('cms.extensions.fancybox.EFancyBox', array(
    'target' => 'a#fancy-link',
    'config' => array( 'onClosed'=>'js:function(){for(name in CKEDITOR.instances){ CKEDITOR.instances[name].destroy(true);}}'
)));

Upvotes: -2

Bernie GGGG
Bernie GGGG

Reputation: 317

I once used angularjs ui-router with one CKEDITOR instance for each sub-view. I used the following solution to clear the instances every time I load the ui-view 

for(name in CKEDITOR.instances)
{
    CKEDITOR.instances[name].destroy()
}

Upvotes: 16

Tomasz Dzięcielewski
Tomasz Dzięcielewski

Reputation: 3907

In my situation

CKEDITOR.instances.myInstanceName.destroy();

didn't help, because I'd opened CKEditor in jquery dialog on double click on some item. When I closed editor and then opened them again, my code crashed.
Solution was using

CKEDITOR.instances.myInstanceName.destroy(false);

which updated DOM element (link to documentation).

Upvotes: 9

Laramie
Laramie

Reputation: 5587

I had this problem. What a pain.

To properly destroy the editor instance, try

if (CKEDITOR.instances.myInstanceName) CKEDITOR.instances.myInstanceName.destroy();

From the documentation here

I solved the missing content issue by assigning the contents of the editor to a hidden field prior to postback. I'm using ASP.Net, but it should work universally.

in the client-side click handler of the submit button, call 

if (CKEDITOR.instances.myInstanceName)
    document.getElementById('hiddenField').value = CKEDITOR.instances.getData();

Upvotes: 48

Related Questions