Multiple wp_editor instances in custom post type using Ajax

Question

In a custom metabox, I need to generate a tinny wysiwyg wp_editor everytime we click on a button.. I struggled a lot with this and couldn't achieve it.

The js

$.ajax({
    url: ajaxurl,
    data: formData,
    dataType: 'html',
    cache: false,
    contentType: false,
    processData: false,
    type: 'POST',
    error: function(jqXHR, textStatus, errorThrown) {
        console.log('FATAL ERROR: ' + JSON.stringify(jqXHR) + ' ' + textStatus + ' ' + errorThrown);
    },
    success: function(data, textStatus, jqXHR) {
        clone.find('.content').append(data);

        // Insert new section at the bottom
        $(clone).appendTo($('#nwac_accordion_plus_signs_container'));
    }
});

The php

// WP Editor
$content = 'Plus sign content here';
$editor_id = 'nwac_plus_signs_' . $_POST['plus_sign_id'] . '_template';
$settings = array(
    'media_buttons' => false,
    'teeny' => true,
    'editor_class' => 'plus_sign_editor',
    'textarea_rows' => 5
);

// Return editor
wp_editor($content, $editor_id, $settings);

\_WP_Editors::enqueue_scripts();
print_footer_scripts();
\_WP_Editors::editor_js();      

die();

Using the code above I get the editor messed!

Answer 1

forget about using wp_editor on such scenario.. instead use the core tinymce, something like;

tinymce.init({
            //selector: 'customEditor-' + nextPlusSignId,
            editor_selector: 'nwac_editor_' + nextPlusSignId,
            mode: "specific_textareas",
            media_buttons: false,
            menubar: false,
            content_css: nw.baseurl + '/skins/wordpress/wp-content.css',
            body_class: 'mce-content-body nwac_plus_signs_' + nextPlusSignId + '_template post-type-products post-status-publish mceContentBody webkit wp-editor wp-autoresize html4-captions has-focus',

        });