not appearing to update textarea in DOM


I am wishing to use CodeMirror in a side-by-side editor (editor/preview panel). Here’s part of my code.

var myEditor = CodeMirror.fromTextArea(page_content, {
    lineNumbers: true,
    mode: "markdown",
    lineWrapping: true,
    indentWithTabs: true

function updateTextArea() {;
myEditor.on('change', updateTextArea);

In dev tools, I expected to see the textarea element keep up to date with changes but it doesn’t seem to be saving.

An aside – elsewhere, I’m using cmark.js (CommonMark) to update the preview panel with this, which uses changes to the original textarea to update the preview…

function parseAndRender() {
    $("#preview").html(qcode.markdown2html($("#post_content, #page_content").val()));

$("#post_content, #page_content").on('keyup paste cut mouseup', parseAndRender);

$("#post_content, #page_content, #preview, .CodeMirror-scroll").scrollTogether();

Calling save on every "change" event should keep the textarea in sync with the editor. I just verified that this works in a simple setup. The problem is thus probably elsewhere. Try to set up a minimal demo page to see where the problem comes from, and if that doesn’t solve your issue, show me the page, so that I can debug it.

Thank you Marijn. Good to know I was on the right track.

I have an isolated demo here.

I can’t seem to spot the problem.

Kind regards, Alistair

The problem you describe does not occur in this demo (the textarea’s value is updated). Please work a little harder on investigating this yourself.