How to pass the wp_editor content using jquery

Question

Himani

2022年4月7日 21:07

I want to add the wp_editor content using jquery.

I have hidden the wp_editor that needs to be displayed in the thickbox on one of the button click

div class="hidden-editor-container" style = "display: none;"
    ?php wp_editor($page_content , 'hidePageContent'); ?
/div

How can I show this editor content into a wordpress thickbox? For example in below div(show-editor-container)

div class="show-editor-container"
    ?php wp_editor('' , 'editPageContent'); ?
/div

I tried adding the below code in my js file but with no result:

var page_content = $("input#page_content").val();
$('.editPageContent').append(page_content);

Thanks in advance!

Category Web

Brian KD · Accepted Answer · 2022年4月7日 21:07

You have to access the tinymce object like this:

tinymce.get("your_textarea_ID_goes_here").setContent("Place your content here");

As a practical example - if you declared your wp_editor like this:

wp_editor( "", "special_content", array() );

Then the tinymce call would look like this:

tinymce.get("special_content").setContent("Place your content here");

Bonus details: if you want to grab the content from the editor use this command:

let editorContent = tinymce.get("your_textarea_ID_goes_here").getContent();

Cheers, Brian