Como carregar o wp_editor via AJAX


17

Alguém sabe como carregar wp_editor via AJAX no WordPress?

Minha marcação e editor estão sendo carregados corretamente, mas os controles do editor não estão sendo carregados corretamente, pode ser porque o Javascript não está sendo executado na chamada AJAX.

Qualquer ajuda seria apreciada.


É uma grande coisa trabalhar. Confira alguns dos códigos da Carrington Build ou Advanced Custom Fields (eu acho ...). Apenas esteja preparado para ficar frustrado.
MikeNGarrett

Respostas:


7

O principal problema são os scripts ausentes. Os scripts enfileirados _WP_Editors::enqueue_scripts()nunca são impressos. O mesmo vale para _WP_Editors::editor_js().

Então você precisa fazer isso no seu manipulador de retorno de chamada AJAX. Eu escrevi um plugin de demonstração e o coloquei no GitHub: T5 AJAX Editor .

Há uma classe chamada Ajax_Editor. Seu método render()imprime o editor em solicitações 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();
}

A ordem exata é importante, e não se esqueça die()do final. O que ainda não funciona é o upload da mídia. Eu recebo um erro de JavaScript quando tento incluir isso.

Observe que a chamada print_footer_scripts();fornecerá mais do que o esperado: alguns plug-ins (Query Monitor, por exemplo) registram seus scripts mesmo para solicitações AJAX, mesmo que não precisem delas.


Muito obrigado! você me salvou de 2 dias tentando conseguir trabalho! a única coisa com isso, se você quiser incluí-lo em um tipo de pós personalizado, ele entra em conflito com outro editor :(
numediaweb

para quem procura, depois do WP 4.8, você pode fazer isso de maneira mais fácil (e limpa) por meio da API JS wp.editor.initialize: wordpress.stackexchange.com/a/274608/76440
majick

0

Depois de lutar com ele, encontrou a solução de uma linha que funciona, no retorno de chamada, adicione:

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

Não faço ideia por que não consegui encontrar documentação dentro do tinymce.

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.