Codemirror editor is not loading content until clicked

Question

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 1

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:

codeMirrorRef.setValue(content); setTimeout(function() {     codeMirrorRef.refresh(); },1); 

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