0

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!

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',

        });

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.