Question

5

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

rated 0 times [ 9] [ 4] / answers: 1 / hits: 16785 / 11 Years ago, tue, october 29, 2013, 12:00:00

I'm quite new to the ACE editor and javascript in general however I have managed to achieve most of what I intended apart from the following:

I would like to enable or disable a 'save' button depending on whether there are outstanding modifications to the document and I have attempted to do this with 'change' event:

UndoManager.reset();



$('#save').addClass(disabled);



editor.on('change', function() {



        if (UndoManager.hasUndo()) {

            $('#save').removeClass(disabled);

        }

        else {

            $('#save').addClass(disabled);

        }



    });

On loading a document the 'disabled' class is removed immediately.

Many thanks in advance if anyone can show me how it should be done.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

stephonkeandrer

Add To Favorites

Follow

Total Points: 392

Total Questions: 94

Total Answers: 100

Location: Tajikistan

Member since Sun, Aug 29, 2021

3 Years ago

stephonkeandrer questions

1 Electron: how to open an url in the same window and after the user do some action go back to application in the same window

Thu, Mar 24, 22, 00:00, 2 Years ago

1 How to disable scroll on body when fullscreen menu open

Sun, Jun 28, 20, 00:00, 4 Years ago

1 How databind a textarea component text value and update it?

Tue, Jun 9, 20, 00:00, 4 Years ago

1 Angular; how to re-render component data when I update variable in script. Binding data is working, but not updating

Mon, May 4, 20, 00:00, 4 Years ago

1 Loading module was blocked because of a disallowed MIME type (“application/wasm”)

Sun, Oct 13, 19, 00:00, 5 Years ago

View All

answered 11 Years ago cristian · Accepted Answer

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>