Get TinyMCE HTML and put the latest text into your form payload

A typical symptom is an editor showing “Doors open at 6:30” while the submitted field still says “Doors open at 6.” Check the value captured by your save code before looking for a database problem.

Read a specific editor instance

Assume TinyMCE is already initialized on this textarea:

<form id="notice-form">
  <textarea id="notice" name="body"><p>Doors open at 6.</p></textarea>
  <button type="submit">Save notice</button>
</form>

After initialization, use its ID to select the editor:

const editor = tinymce.get('notice');
if (!editor) throw new Error('Notice editor is not ready');

const html = editor.getContent();
console.log(html);

Using the named instance makes the destination clear when the page has several editors. Retrieve the content after the user has made the edit and when the initialized instance is available.

Synchronize before taking the form snapshot

This handler stops native submission so you can inspect exactly what your application would send. Attach it after the form exists and TinyMCE has initialized:

const form = document.querySelector('#notice-form');

form.addEventListener('submit', (event) => {
  event.preventDefault();
  const editor = tinymce.get('notice');
  if (!editor) throw new Error('Notice editor is not ready');

  editor.save();
  const payload = new FormData(form);
  console.log(payload.get('body'));
  // Send payload through your application's existing save handler.
});

The order matters. A FormData object created before editor.save() has already captured the field values. Updating the textarea afterward does not update that earlier object. The textarea also needs a name, here body, for the expected form field.

For the illustrative opening-time edit, inspect these values:

These are expected checks for your page, not a transcript of a live database save. TinyMCE can normalize markup, so check the intended content instead of requiring byte-for-byte equality with typed HTML.

Follow the value into the actual save route

Inspect the outgoing request in your browser's Network panel. If it contains the updated HTML but reloading the record shows the old time, investigate the application's response handling, persistence, and reload path. getContent() and editor.save() alone do not save a record to your server.

If you use TinyMCE's Save plugin, its default button submits the containing form. Avoid a form control named submit, which can collide with the form's method. Save plugin behavior

For the broader native form flow, see HTML form submission. Keep the editor synchronization at the point where your actual save path captures its fields, then reload the saved notice to confirm the displayed time.