1

Quando adiciono uma textarea diretamento no html o tinymce funciona, mas com o append do jquery, assim:

$(".nova_questao").click(function(){

      $(".questoes").append(
            '<div class="questao">'+
            '<h4 class="h5">1. Cod: </h4>' +
            '<div class="questao-body">' +
            '<textarea name="enunciado" class="texto" data-id="">Enunciado da questão</textarea>' +
            '<div class="line"></div>' +
            '<h4 class="h5">Alternativas da questão: </h4>' +
            '</div>' +
            '</div>'
      );
});

Ele não funciona, porque?

2 Respostas 2

2

Funciona normalmente. Seu problema deve está em como você está fazendo esse append.

Veja a baixo a estrutura de como fazer o append. Ele deve ser feito após o elemento que irá receber o textarea:

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src='https://cloud.tinymce.com/stable/tinymce.min.js'></script>
</head>
<body>

<div class="questoes"></div>

<script>

tinymce.init({
    selector: '.texto'
});
$(".questoes").append('<textarea name="enunciado" class="texto" data-id="">Enunciado da questão</textarea>');

</script>
</body>
</html>

tinymce.init({
	selector: '.texto'
});
$(".questoes").append('<textarea name="enunciado" class="texto" data-id="">Enunciado da questão</textarea>');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src='https://cloud.tinymce.com/stable/tinymce.min.js'></script>
<div class="questoes">
</div>

1
  • Mas é que o append está dentro de uma função, olha como está. (Editei a pergunta la em cima). @DvD Commented 4/11/2017 às 18:59
1

Consegui resolver criando uma função contendo o "tinymce.init" e toda vez que adiciono uma textarea, uso a função para carregar o editor:

$(".nova_questao").click(function(){

  $(".questoes").append(
        '<div class="questao">'+
        '<h4 class="h5">1. Cod: </h4>' +
        '<div class="questao-body">' +
        '<textarea name="enunciado" class="texto" data-id="">Enunciado da questão</textarea>' +
        '<div class="line"></div>' +
        '<h4 class="h5">Alternativas da questão: </h4>' +
        '</div>' +
        '</div>'
  );

  //Função que carrega o init do Tinymce
  loadTinymce();

});

Exemplo da função:

function loadTinymce() {
    tinymce.init({
        selector: '.texto'
    });
}
3
  • Marque a sua resposta como certa.
    – Sam
    Commented 4/11/2017 às 21:06
  • Não consigo, só possa daqui dois dias. Já tentei @DvD Commented 4/11/2017 às 21:07
  • Ah é mesmo. então daqui a 2 dias vc marca :)
    – Sam
    Commented 4/11/2017 às 21:07

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .