Add variable inside tinymce editor

Asked

Viewed 283 times

1

I’m using the https://www.tiny.cloud/ to create a text editor.

At the time of editing, it is necessary to add variables, which at the time of printing will be exchanged for the value corresponding to each variable.

Example: The $eCNPJ variable will be a substitute and the corresponding CNPJ will appear.

PROBLEM:

When clicking on the variable, it should appear in the inside of the editor at the marked position, this is not happening.

CODE:

$(document).ready(function() {

  tinymce.init({
    selector: 'textarea'
  });


  $('.button').click(function(event) {
    event.preventDefault();
    $('#editor1').tinymce('insertText', ` ${this.innerText} `);
  });

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea id="editor1" class="form-control" name="texto"></textarea>

<br>

<small><strong>ESCOLA...:</strong>
      <a href="#" title="CNPJ" class="button">$eCNPJ</a>
      - <a href="#" title="Rasão Social" class="button">$eRSocial</a>
      - <a href="#" title="Nome Fantasia" class="button"> $eNFantasia</a>
      - <a href="#" title="E-mail" class="button"> $eEmail</a>
      - <a href="#" title="Telefone" class="button"> $eTelefone</a>
    </small>

javascript html tinymce

  • Where does the CNPJ number come from, for example?

  • I have a separate file that changes the variables only when it will generate the PDF. On this screen I will only save in the database.

  • 1

    Swap the line that inserts the text with this: tinymce.activeEditor.execCommand('mceInsertContent', false, ' '+ this.innerText +' ');... see if it works in the version you’re using.

  • @Sam, it worked. Puts as a response for me to mark as solved. Thank you.

1 answer

1


Instead of using .tinymce('insertText'..., use the command mceInsertContent:

tinymce.activeEditor.execCommand('mceInsertContent', false, ` ${this.innerText} `);

Will insert a text at the position where you are editing.

See documentation

Browser other questions tagged javascript html tinymce

You are not signed in. Login or sign up in order to post.