Question

I have a form where I remove some CKeditor instantiated textareas with jQuery’s .remove() and add new ones through this function:

function addchapter() {
    var randomnumber = Math.floor(Math.random()*9999);
    var clone = $("#newchapter").clone(); //which is a hidden DIV containing the plain HTML to be added in form
    $(clone).attr('id',randomnumber);
    $("#chapters").prepend(clone);

    var newrandom = Math.floor(Math.random()*9999);
    $("#"+randomnumber+" textarea").attr('id',newrandom);

    CKEDITOR.replace( newrandom );
}

which works but when I submit the form, the Ckeditor textarea that is newly added sends empty value.

This only happens when I remove one CKeditor textarea from form and add a new one after that. If I add any textarea through the function works great as long as I don’t remove any existing ones.
BTW, the existing ones gets added from database through PHP loop, it’s actually an edit form

Any ideas ?

Thanks.

Answer 1

Seems like I had to destroy the CKeditor instance before I remove the HTML code, whenever I had to do .remove() on any entry.

So before you remove the CKeditor textarea, you should do:

CKEDITOR.instances['textareaID'].destroy(true);

Cheers.