Eu precisei de muito mais código para que funcionasse, e também estava recebendo um erro de javascript: Deprecated TinyMCE API call: <target>.onKeyUp.add(..)
Isso foi causado por uma atualização do wordpress de 3.x para 4. Então tive que clear my browser cache
primeiro.
Primeiramente eu adicionei um retorno de chamada ao filtro wp tiny_mce_before_init
no meu arquivo functions.php, isso me permitiu adicionar uma função de retorno de chamada js a ser disparada quando os editores foram inicializados:
add_filter( 'tiny_mce_before_init', array( $obj, 'filter_cb_mce_before_init' ) );
/**
* Filter cb to add event listeners to tinymce editor.
* @param array $init An array of setup js functions as strings.
* @return array Returns new array of js function strings.
*/
function filter_cb_mce_before_init( array $init ) {
$init['setup'] = "function(ed){
if(get_tinymce_content) //not required, I use it as flag to check if on correct page
ed.on('change', function(){ get_tinymce_content() });
}";
return $init;
}
A seguir, a função javascript para fazer o que quiser com o conteúdo quando ele for alterado. Adicione este javascript usando wp_enqueue_scripts à página desejada.
/**
* Get the content of the tinyMCE editor.
* @link http://wordpress.stackexchange.com/questions/42652/how-to-get-the-input-of-a-tinymce-editor-when-using-on-the-front-end
* @return {string} Returns the content
*/
function get_tinymce_content(){
//change to name of editor set in wp_editor()
var editorID = 'my_editor_id';
if (jQuery('#wp-'+editorID+'-wrap').hasClass("tmce-active"))
var content = tinyMCE.get(editorID).getContent({format : 'raw'});
else
var content = jQuery('#'+editorID).val();
console.log(content);
}
O código funcionou quando usei o seguinte para imprimir o editor em qualquer página:
<?php wp_editor( @$event->description, 'my_editor_id', array(
'media_buttons' => false,
'textarea_name' => 'data[description]',
'quicktags' => array("buttons"=>"link,img,close"),
) ); ?>