cm.save() not appearing to update textarea in DOM

1

Hi,

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,
    lineNumbers:false,
    indentWithTabs: true
});

function updateTextArea() {
    myEditor.save();
}
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);
parseAndRender();

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

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.

3

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

I have an isolated demo here. http://jsfiddle.net/bkstnfk0/44/

I can’t seem to spot the problem.

Kind regards, Alistair

4

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.