Al agregar dinámicamente un textarea con JavaScript, ¿cómo renderizarlo como editor tinyMCE en WordPress?

Question

Al agregar dinámicamente un textarea con JavaScript, ¿cómo renderizarlo como editor tinyMCE en WordPress?

11 jun 2014, 00:06:53

Vistas: 16.5K

Votos: 3

Tengo un plugin que permite al usuario agregar dinámicamente secciones que necesitan tener el editor tinyMCE. jQuery clona un div y lo coloca en un contenedor. Uno de los campos es un textarea configurado así:

<textarea name="sectionContent_1" id="sectionContent_1"></textarea>

Necesito reemplazar el textarea con el editor tinyMCE.

He revisado:

Cómo cargar wp_editor() mediante AJAX/jQuery y usar wp_editor de WordPress en HTML dinámico/ajax

Ninguna de estas soluciones parece funcionar para nosotros

He intentado esto dentro del trigger que llama para agregar la sección del textarea:

$(this).parent().find('.sectionOptions').html(ctHolder);

var textAreaID = 'sectionContent_'+sectionID;

tinyMCE.execCommand('mceRemoveEditor', true, textAreaID);
tinyMCE.execCommand('mceAddControl', false, textAreaID);

En este código, estoy agregando los datos clonados (ctHolder) al .sectionOptions, configurando el ID del textarea, reiniciando el editor en el ID y luego agregando control al ID... esto no funciona pero parece ser la sugerencia más común.

dcp3450

475

ajax tinymce

Comentarios

Posible duplicado de Cómo cargar wp_editor() mediante AJAX/jQuery

T.Todua

15 ago 2016 19:08:45

Todas las respuestas a la pregunta

Comentarios

Por favor, agrega también alguna explicación.

Nilambar Sharma

22 mar 2015 05:59:28

Esto realmente ayuda. Funciona.

harrrrrrry

1 jun 2015 21:09:57

Arquimedes de Siracusa 121 · Answer 1 · 2015-03-22T01:20:37Z

tinymce.remove();
tinymce.init();

¡Esto funciona bien!

Arquimedes de Siracusa

121

22 mar 2015 01:20:37

dcp3450 475 · Answer 2 · 2014-06-11T00:36:50Z

Esto funcionó:

var textAreaID = 'sectionContent_' + sectionID;
$(this).parent()
    .find('.sectionOptions')
    .html(ctHolder).ready(
        function() {
            tinyMCE.execCommand('mceAddEditor', false, textAreaID); 
        }
    );

WordPress 3.9 usa tinyMCE 4.x, por lo que "mceAddControl" fue cambiado a "mceAddEditor". Además, coloqué la llamada dentro de una función ready para que jQuery no ejecutara tinyMCE hasta después de cargar el textarea en el DOM.

dcp3450

475

11 jun 2014 00:36:50