JSFiddle - React, Tailwind, and code Playground

Synchronising TinyMCEs

by tonytlwu

HTML

<script src="https://tinymce.cachefly.net/4.0/tinymce.min.js"></script>
<div style="width:50%;float:left">
  <label>Text 1</label>
  <textarea name="text1">
    <p>Some text 1</p>
  </textarea>
</div>
<div style="width:50%;float:left">
  <label>Text 2</label>
  <textarea name="text2">
    <p>Some text 2</p>
  </textarea>
</div>
<hr />
<p>Click the button below to display the current values of the hidden textareas</p>
<p>
  <button id="showValues" text="">Show textarea values</button>
</p>
<div id="values"></div>

CSS

body {
  font-family: arial, helvetica, sans-serif
}

label {
  font-weight: bold
}

JavaScript

// Table
// Font selection

tinymce.init({
  selector: "textarea",
  statusbar: false,
  setup: function(editor) {
    editor.on('change', function() {
      tinymce.triggerSave();
    });
  }
});