CodeMirror - Change editor value on button click

Question

I tried to change the value in code mirror editor but it doesn't work.

function myFunction() {
    getFi();//get the new code
    editor.setValue(fi);
    editor.refresh();
}

I also tried to change the text area value, but it doesn't work.

function myFunction() {
    getFi();//get the new code
    document.getElementById('code').value = fi;
    editor.refresh(); 
}

Edit: partial code, here the initialization of the editor and the function that should load the code

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src='http://codemirror.net/lib/codemirror.js'></script>
<script src='http://codemirror.net/mode/xml/xml.js'></script>
<script src='http://codemirror.net/mode/javascript/javascript.js'></script>
<script src='http://codemirror.net/mode/css/css.js'></script>
<script src='http://codemirror.net/mode/htmlmixed/htmlmixed.js'></script>
</head>
<body>
<textarea id="code" name="code" ></textarea>
<button type="button" id="execute" onclick="myFunction()">Load Code</button>
<script>
    var editor = CodeMirror.fromTextArea(document.getElementById('code'), {
        mode: 'text/javascript',
        tabMode: 'indent',
        lineNumbers: true,
        lineWrapping: true,
        autoCloseTags: true,
        indentWithTabs: true
    });

    function myFunction() {
        getFi();//get the new code
        editor.setValue(fi);
        editor.refresh();
    }

    function getFi(){
        /*get new code from a file*/
    }
</script>
</body>
</html>

Please include the plugin links also or post a functional example that illustrates your problem on [jsFiddle](http://jsfiddle.net/). — palaѕн, Jul 13 '16 at 13:08
@palaѕн I added more code, obviusly it's only partial code from my page but it should give you an idea — ale93p, Jul 13 '16 at 13:20
What is `fi` here? Is it variable or string? Have you tried `editor.setValue('Some demo text');`? — palaѕн, Jul 13 '16 at 13:50
`fi` is a string that I load from a file, I also tried putting a default string but it also doesn't work. — ale93p, Jul 13 '16 at 13:53
Have you tried [this](http://stackoverflow.com/a/21055292/1823841)? — palaѕн, Jul 13 '16 at 13:56
Yes, it doesn't work. I noticed that the function works if I call it on page load. It doesn't change editor value only if I call the function on button click. — ale93p, Jul 13 '16 at 13:57
If its working on page load that means issue is elsewhere. Try putting a `debugger;` inside `myFunction()` and see if editor is undefined or null on button click and see if you are getting correct value for `fi` or is it empty. — palaѕн, Jul 13 '16 at 14:04
I yet checked the `fi` value and it's correct, and it seems not to be errors with the editor, if I try a `getValue()` right before the `setValue()` it returns the correct value in the editor but the following `setValue()` doesn't do anything. — ale93p, Jul 13 '16 at 14:13

score 0 · Answer 1 · answered Oct 16 '19 at 00:51

0

You may try to get a reference to the CodeMirror instance:

    function myFunction() {
        var editor = $('.CodeMirror')[0].CodeMirror;
        editor.setValue(fi);
        editor.refresh();
    }

answered Oct 16 '19 at 00:51

eQ19

9,880
3
65
77

CodeMirror - Change editor value on button click

1 Answers1