Inicialize o editor TinyMCE / editor visual após a inserção do AJAX


11

Eu tenho um grupo de campos no estilo "repetidor" em uma página de opções personalizadas. Há um editor visual ativo em um estado oculto e, quando o usuário clica em "adicionar novo", a linha inteira é clonada. Preciso inicializar o editor visual na linha clonada. Meu código:

$('.repeater-add-new').click(function(event) {
    event.preventDefault();
    var target = $(this).data('repeater');
    $( '#' + target).find('.repeater-row:not(.clone) .repeater-content.in').collapse();
    var newRow = $( '#' + target + ' .repeater-row.clone' ).clone().appendTo( '#' + target + ' .repeater-row-wrapper' ).removeClass('clone');
    rebuildIndex(target);

    // Initialize editors if needed
    newRow.find('.wp-editor-wrap').each(function(index, el) {
        var ed_id = $(this).find('textarea').attr('id');

        tinymce.init(tinyMCEPreInit.mceInit[ed_id]);
        tinymce.execCommand('mceAddEditor', false, ed_id); 
        quicktags({id : ed_id});
    });
});

Captura de tela da interface:

Captura de tela

Quando a página carrega, recebo o erro do console:

TypeError não capturado: não é possível ler a propriedade 'onpageload' de undefined

E é claro que o editor não funciona. Depois de salvar a página, ela funciona bem, é claro, mas preciso que ela funcione quando a linha é adicionada também.


você conseguiu solução para o problema 'onpageload'
Kvvaradha

Parece que você também pode precisar registrar algumas coisas com tags rápidas. Não tenho 100% de certeza, pois não posso testar isso localmente, mas você pode começar com stackoverflow.com/questions/21519322/… para ver se isso ajuda.
phatskat

Ei, me deparei com isso novamente. OP, você pode adicionar um trecho de como adicionar um desses campos ao editor de postagem? Posso tentar reproduzi-lo localmente e investigá-lo se você puder fornecer uma maneira de suportar isso sozinho.
phatskat

Hey @phatskat, obrigado. Na verdade, acabei seguindo uma direção totalmente diferente ... o cliente queria empacotar esse sistema para venda comercial, então reescrevemos tudo usando uma interface personalizada sem o ACF. Aprecie a oferta para ajudar!
24518 Jack Arturo

Respostas:


1

Você conseguiu que o editor funcionasse sem o seu javascript incluído? Nesse caso, tente criar um modelo que inclua um editor de timbre funcional e reescreva seu javascript para copiar esse modelo usando o WithDataAndEventsargumento da clone()função jQuery definido como true.

Por exemplo:

$('.cloner').click(function(){
  $('.container').append($('.template').clone(true).removeClass('hidden'));
});
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.