wp_editor() in content that was loaded with ajax

Question

I try to use wp_editor() in content that was loaded with ajax, but none of the required files and some other configuration script not loaded :

The structure of ajax is something like this:

function get_test_page(){
   include( TEMPLATEPATH . '/page.php' );
   die( main() );
}
add_action( 'wp_ajax_nopriv_get_test_page', 'get_test_page' );
add_action( 'wp_ajax_get_test_page', 'get_test_page' );

page.php :

function main(){
    wp_editor('','unique_id');
}

Editor is loaded but needed files is not loaded.

• http://.../wp-includes/js/tinymce/wp-tinymce.php

• http://.../wp-includes/js/tinymce/skins/lightgray/skin.min.css

• http://.../wp-admin/load-scripts.php?c=1&load%5B%5D=...mce-view,imgareaselect,image-edit,word-count,editor,quicktags,wplink,thick..

• http://.../wp-includes/js/tinymce/langs/{}.js

• ...

Some related post but doesn't help me :

use wordpress wp_editor in dynamic/ajax html

How to load wp_editor() through AJAX/jQuery

Answer 1

Solution:

Add wp_editor() in somewhere that works perfectly and hide it.

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

after that assign editor contents to the global JS variable.

EDITOR = $('.hidden-editor-container').contents();

Finally when the ajax page is loaded append editor contents

$('.editor').append( EDITOR );

tinymce.execCommand( 'mceRemoveEditor', false, 'editor' );
tinymce.execCommand( 'mceAddEditor', false, 'editor' );