6

How can I change the theme in the Ace editor on the change event from a select? I am able to programmatically set the theme on dom ready event. The code I am invoking (for both events) looks like below and I am passing values like ("ace/theme/clouds"/"ace/theme/clouds_midnight").

setThemeValue = function(themeVal){
var editor = ace.edit("editor");
editor.setTheme(themeVal);
editor.getSession().setMode("ace/mode/javascript");
};

1 Answer 1

16

"setTheme" change the theme that you use on the fly, and you do not need to redo ace.edit("editor").

So I propose instead a code like this:

// Initialize your Ace Editor
var editor = (function() {
    var aceEditor = ace.edit("editor");
    // default theme
    aceEditor.setTheme("ace/theme/clouds");
    aceEditor.getSession().setMode("ace/mode/javascript");
    return aceEditor;
})();

// Change theme on the fly
editor.setTheme("ace/theme/clouds_midnight");
1
  • Thanks this was just what i was looking 4.
    – vovven
    Commented May 28, 2021 at 10:13

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.