How to use the UndoManager to determine if document has unsaved changes

Your solution has a disadvantage: after saving, you are not able to undo. Most modern editors allow undo after saving.

I suggest that you record down the original text and do a comparision whenever text changes. if text equals origin, disable save button.


Call editor.session.getUndoManager().reset() after loading the document and use isClean, markClean methods on undoManager.

var saveButton = document.getElementById("save")
var editor = ace.edit("editor")
// using input event instead of change since it's called with some timeout
editor.on("input", function() {
    saveButton.disabled = editor.session.getUndoManager().isClean()
});

saveButton.addEventListener("click", function() {
    editor.session.getUndoManager().markClean()
    saveButton.disabled = editor.session.getUndoManager().isClean()
})
<script src="http://ajaxorg.github.io/ace-builds/src/ace.js"></script>
<button id="save">save</button>
<div id="editor" style="height:200px"></div>