CODEWITHSUNDEEP
jquerycodemirror
Bri
Bri

Reputation: 739

CodeMirror not updating textarea correctly

I have multiple instances of CodeMirror on my page inside a jquery-ui tab widget. I create these instances dynamically like so:

//Returns a code mirror editor
editor.create = function(id){

    var codeID = "code-" + id;
    var $node = $('<form><textarea id="' + codeID + '" name="' + codeID + '">test</textarea></form>');
    editor.editors[id] = CodeMirror.fromTextArea($node.find("textarea").get(0), editor.options);

    return $node;


};

Each instance is stored in a global array called editors.

Once it is created, it is appended to the DOM.

var $editor = editor.create(id);
var tabID = "tabs-" + id;
var $tab = $('<li id=' + id + '><a href="#' + tabID + '">' + name + '</a> <span class="ui-icon ui-icon-close" role="presentation">Remove Tab</span></li>');
var $tabPanel = $('<div id="' + tabID + '"></div>');

$tabPanel.append($editor);

$('#coder > ul').append($tab);
$('#coder').append($tabPanel);
coderTabs.tabs("refresh");

The test text placed in the textarea displays in the editor. However, calling editor.editors[id].save() does not update the textarea.

$('#project-save').click(function(){
        var active = $( "#coder" ).tabs( "option", "active" );
        var id = $('#coder .ui-tabs-nav li').eq(active).attr("id");
        console.log(editor.editors[id]);
        editor.editors[id].save();
        return false;
});

I am not sure what step I am missing to get the textarea to update. Any help would be much appreciated!

Upvotes: 3

Views: 3065

Answers (1)

Bri
Bri

Reputation: 739

Turns out I had the wrong concept about how this worked. I added .save() to onBlur and then when it comes time to do something with the data I call .getValue() on the editor instance.

Upvotes: 5

Related Questions