Search code examples
javascriptextjscodemirror

Javascript/ExtJS - get Codemirror Editor by textarea


Hello stackoverflow community,

i just built a Codemirror Editor into an ExtJSProject like so:

addCodeMirrorPanel: function() {
   this.getAixmFormarea().add(Ext.widget({
        xtype: 'textarea',
        fieldLabel: 'AIXM',
        autoScroll: true,
        name: 'aixm',
        id: 'codearea',
        width: 800,
        height: 300,
        resizable: true,
        resizeHandles: 's se e',
        listeners: {
            afterrender: function () {
                var textarea = Ext.getCmp('codearea');
                var codemirror = CodeMirror.fromTextArea(textarea.inputEl.dom,{
                    lineNumbers: true,
                    content: '',
                    matchBrackets: true,
                    electricChars:true,
                    autoClearEmptyLines: true,
                    extraKeys: {"Enter": "newlineAndIndentContinueComment"}
                });
            }

        }
    }));

}

Now what i want to do is access the codemirror editor from a different Controller function and im not quite sure about how to do that. no getinstance() , geteditorbyID() or similar methods are specified in the codemirror manual and i cant seem to access it from the now hidden textfield either.


Solution

  • Well why are you discarding the instance after you are creating it? Perhaps you could simply store it on the widget?

    this.codeMirror = CodeMirror.fromTextArea(...);