Cómo cargar wp_editor a través de AJAX

17

¿Alguien sabe cómo cargar wp_editor a través de AJAX en WordPress?

Mi marcado y editor se están cargando correctamente, pero los controles del editor no se están cargando correctamente, puede deberse a que Javascript no se está ejecutando en la llamada AJAX.

Cualquier ayuda sería apreciada.

— usuario17108
fuente

Es un infierno ponerse a trabajar. Echa un vistazo a algunos de los códigos de Carrington Build o Advanced Custom Fields (creo que ...). Solo prepárate para sentirte frustrado.

— MikeNGarrett

7

El principal problema son las secuencias de comandos que faltan. Los guiones en cola _WP_Editors::enqueue_scripts()nunca se imprimen. Lo mismo es cierto para _WP_Editors::editor_js().

Entonces debe hacerlo en su controlador de devolución de llamada AJAX. He escrito un complemento de demostración y lo puse en GitHub: T5 AJAX Editor .

Hay una clase llamada Ajax_Editor. Su método render()imprime el editor en solicitudes AJAX.

public function render()
{
    if ( ! $this->validator->is_valid( TRUE ) )
        die( 'nope' );

    wp_editor( $this->data->get(), $this->editor_id, $this->settings );
    \_WP_Editors::enqueue_scripts();
    print_footer_scripts();
    \_WP_Editors::editor_js();

    die();
}

El orden exacto es importante, y no se olvide die()al final. Lo que aún no funciona es la carga de medios. Recibo un error de JavaScript cuando intento incluir eso.

Tenga en cuenta que las llamadas print_footer_scripts();le darán más de lo que esperaba: algunos complementos (Monitor de consultas, por ejemplo) registran sus scripts incluso para solicitudes AJAX, incluso si no los necesitan allí.

— fuxia
fuente

¡Muchas gracias! me salvaste de 2 días tratando de conseguir trabajo! lo único con esto, si desea incluirlo en un tipo de publicación personalizada, entra en conflicto con otro editor :(

— numediaweb

para cualquiera que busque, después de WP 4.8 puede hacer esto más fácilmente (y limpiamente) a través de la API de JS wp.editor.initialize: wordpress.stackexchange.com/a/274608/76440

— majick

0

Después de luchar con él, encontré la solución de una línea que funciona, en callback add:

tinymce.execCommand( 'mceAddEditor', true, element.id );

No tengo idea de por qué no pude encontrar documentación dentro de tinymce.

— Goran Jakovljevic
fuente