TinyMCE 4 - remove() or destroy()

Question

I am using TinyMCE editor. I want to remove or destroy tinymce editors (Page contain more then one editor). Also remove classes and IDs added by tinyMCE.

But leave editable contents

I tried :

tinymce.remove()
tinymce.destroy()
tinymce.execCommand('mceRemoveControl',true,'.editable');

Please note:

my editor class is .editable, And I have more then one editors in my page.

Answer 1

Little late to the party but I recently added tinyMCE jQuery version to my angular project. For a few reasons I did not want to use the angular 3rd party code and just wanted the jQuery version to work.

So here is my code for making TinyMCE 4.x work in angular, even with ng-repeat.

All you have to do is decorate your textareas with the class "TinyMCEEditorBox" and call this method anytime you remove or add items that result in an update (such as more items being added to an ng-repeat).

$scope.RebindTinyMCE = function ()
{
    var tmceSelector = ".TinyMCEEditorBox";

    for (var i = tinymce.editors.length - 1 ; i > -1 ; i--)
    {
        tinyMCE.execCommand("mceRemoveEditor", true, tinymce.editors[i].id);
    }

    setTimeout(function () {
        $(tmceSelector).tinymce({
            menubar: false,
            statusbar: false,
            toolbar: 'bold italic underline | alignleft aligncenter alignright | bullist numlist outdent indent | link',
        });
    }, 50);
}

Answer 2

You need simply use this code in order to remove all the editable textarea:

tinyMCE.remove(".editable");

Here more info about tinyMCE remove: http://archive.tinymce.com/wiki.php/api4:method.tinymce.EditorManager.remove.static