ejdickerson ejdickerson - 1 month ago 17
jQuery Question

Ace Code Editor Set Language Dynamically

I'm attempting to implement Ace Code Editor with a drop down to select the language. My drop down has an id of mode. I have got the editor to work correctly, but I cannot change the language using the drop down as I would like it to do. My current code is

var editor = ace.edit("code");
var textarea = $('textarea[name="code"]').hide();
editor.getSession().on('change', function(){

$('#mode').on('change', function(){
var newMode = $("mode").val();
path: "ace/mode/" + newMode,
v: Date.now()});

As above, this successfully launches the editor, however I can't change the language from SQL, which is the initial language. I came across this question Dynamically update syntax highlighting mode rules for the Ace Editor
which is why I've included

v: Date.now()

but still no luck.


you have a typo in the editor.session().setMode({ line

use editor.session.setMode("ace/mode/" + newMode) instead of it.

v: Date.now() was needed to disable caching, you most likely do not need that.