Karl Karl - 6 months ago 97
Javascript Question

Codemirror editor is not loading content until clicked

I am using codemirror 2 and its working fine except that the editor's set value doesn't load into the editor until I click the editor and it becomes focused.

I want the editor to show the content of itself without it having to be clicked. Any ideas?

All of the codemirror demos work as expected so I figured maybe the textarea isn't focused so I tried that too.

$("#editor").focus();
var editor = CodeMirror.fromTextArea(document.getElementById("editor"), {
mode: "text/html",
height: "197px",
lineNumbers: true
});

Answer

You must call refresh() after setValue(). However, you must use setTimeout to postpone the refresh() to after CodeMirror/Browser has updated the layout according to the new content:

this.codeMirrorInstance.setValue(content);
var that = this;
setTimeout(function() {
    that.codeMirrorInstance.refresh();
},1);

It works well for me. I found the answer in here.