Hi Murray,

Firstly, very happy that my BackOffice Power Scripts package is coming in handy! (even if I haven't "officially" released it yet)

I took a look at the the TinyMCE source, to see what was happening with the 'onchange_callback' event. It adds an anonymous function to the 'onChange' dispatcher ... so if you can locate the TinyMCE instance (easy if there is only 1 on your page), then you could try this?

tinymce.editors[0].onChange.add(function(){
    console.log(arguments)
});

Good luck!

Cheers, Lee.

Sweet, I looked up the MCE api and found the onAddEditor call too so my script now looks like this, it seems to work well for simple input and tinyMCE

You could remove the keyup event to reduce cpu load, but you will miss some (probably minor) change scenarios.

function confirmNavigateAway(evt) {
    var message = 'You have not saved your changes';
    if (typeof evt == 'undefined') {
        evt = window.event;
    }
    if (evt) {
        evt.returnValue = message;
    }
    return message;
}

jQuery(function () {
    $('select,input:not(.editorIcon)').change(function () { window.onbeforeunload = confirmNavigateAway; });
    $('#__controls input:not(.editorIcon), #__controls textarea').bind('keyup', function () { window.onbeforeunload = confirmNavigateAway });
    $('input.editorIcon,input.editorIconOver').click(function () { window.onbeforeunload = null; });
    if (window.tinymce) {
        tinymce.onAddEditor.add(function (sender, editor) {
            editor.onKeyUp.add(function (editor, event) {
                if (editor.isDirty())
                    window.onbeforeunload = confirmNavigateAway;
            });
            editor.onChange.add(function (editor) {
                if (editor.isDirty())
                    window.onbeforeunload = confirmNavigateAway;
            });
    }
    });
});

Ok, now I want to detect changes in other datatypes.

the following is a blunt instrument, but it detects most ajax datatype modifications:

$(".propertypane").delegate("a", "click", function () { alert('propertypane click') });

However, with MNTP, It appears some actions do event.stopPropagation(); so it's not working correctly with that.

Does this also work if you try to open another node in the tree? I'm trying something similar in Umbraco 5, but when onbeforeunload is fired the page is already closed. 

Jeroen

It catches any scenario where the page gets unloaded, so yes.

I forget what my final javascript was, but it seems to work, give me a yell if you want me to dig up what we actually used in the end.

also, for a slightly different solution to the oops forgot to save problem, check out lee's sysyphus script on this thread: http://our.umbraco.org/forum/developers/extending-umbraco/29486-BackOfficePowerScripts-nuggets

The sisyphus solution looks really cool! If you could also get the final javascript which you used that would be awesome!

Jeroen

Here's what we're using:

function confirmNavigateAway(evt) {
    var message = 'You have not saved your changes';
    if (typeof evt == 'undefined') {
        evt = window.event;
    }
    if (evt) {
        evt.returnValue = message;
    }
    return message;
}

jQuery(function () {
    $('select,input:not(.editorIcon)').change(function () { window.onbeforeunload = confirmNavigateAway; });
    $('#__controls input:not(.editorIcon), #__controls textarea').bind('keyup', function () { window.onbeforeunload = confirmNavigateAway });
    $('input.editorIcon,input.editorIconOver').click(function () {
        $('body').data('isSaving', true);
        window.onbeforeunload = null;
    });

    if (window.tinymce) {
        tinymce.onAddEditor.add(function (sender, editor) {
            editor.onKeyUp.add(function (editor, event) {
                if (editor.isDirty())
                    window.onbeforeunload = confirmNavigateAway;
            });
            editor.onChange.add(function (editor) {
                if (editor.isDirty() && ! $('body').data('isSaving'))
                    window.onbeforeunload = confirmNavigateAway;
            });
        });
    }

    /*
    Can't use the following is an issue in IE because IE interprets every click on an anchor as onbeforeunload event, even if it's not
    $(".propertypane").delegate("a, a div", "click", function () { window.onbeforeunload = confirmNavigateAway; });
    */
});

Good news, I finally released the BackOffice Power Scripts package.

I also released Sisyphus as a standalone package - it doesn't need to depend on BackOffice Power Scripts being installed.

Cheers, Lee.

is working on a reply...