Simplemde-markdown-editor: Editor stays empty until focus

[ElForastero]

I'm trying to use multiple editors on single page with Angular. There is some sort of confusion. First editor displays well, but anothers stay empty until click on them.

This is trouble with angular, or I neeed to know something?

upd:

Solved by adding timeout with codemirror.refresh(). Maybe there are more elegant solutions?

[WesCossick]

Sounds to me like an implementation or Angular issue.

[kinow]

Seeing the same behaviour on a Backbone.js app. Will dig deeper and try to debug it over the next days and report back here, but probably some other library is causing the issue, or maybe the way it's being loaded with RequireJS

[kinow]

For the record, the issue was in CodeMirror, not in SimpleMDE.

We have two screens on our app. One - single page backbone.js standard view - where everything works fine. Another one - multiple views page - where the editor(s) don't display values until clicked/focused.

The code in both screens is pretty much the same. Tried calling a few methods in SimpleMDE, set the value programmatically, and even toggle full screen.

But then thought that it could be in CM. Googling found a few users complaining about the same thing. And turns out CM has the refresh method that can be used, maybe in combination with setTimeout.

We used the refresh method, setTimeout, set the value programmatically (not in the HTML template), and now it's working again :-)

Hope it helps a fellow coder when s/he faces the same problem.
Bruno

[AidasK]

I am having the same issue then simplemde is loaded in collapsed(hidden) div. Once div is open, simplemde is blank, but on focus content shows up.

setTimeout(function() { simplemde.codemirror.refresh(); }, 0);

This code does not help, probably I need to do it then div is open. But this is just a workaround and it should be fixed in core .

[darrenklein]

Thank you all, this is very helpful.

[jvpernis]

I also ran into this issue, but instead of using setTimeout, I was able to prevent the editor from staying blank by swapping the order of setting the editor content and making the editor visible.

Setting the content apparently copies the visibility state of the editor, but it doesn't detect when the editor does becomes visible.

So if I make sure the editor is in a visible state before I set the content, the editor shows up correctly with the actual content, instead of being blank.

E.g. an onClick function could look like this:

```javascript
function display_form(){
var content;
/* ... */
document.getElementById('edit_form').style.display='block';
simplemde.value(content);
}