Question

I have a form (with just one text area) that is submitted using AJAX to allow users to save a note about a page. The form stays visible on the page all the time, and you can keep clicking save to keep updating the note.

In safari (but not chrome or FF), if you start typing in the form and hit reload, the browser prompts you with a “are you sure you want to reload, you have unsaved changes” type dialog. My problem is that the dialog also pops up if you save your note, and then hit reload without making any further changes to the text area. Is there some way in javascript for me to mark the form as submitted // unchanged so that safari knows not to show the prompt?

Answer 1

I’m not too sure about safari, but you can have this behavior in all browsers with the following:

var confirmLeavePage = "Are you sure you want to exit this page, you have unsaved changes..."
window.onbeforeunload = askConfirm;
function askConfirm(){
    if (confirmLeavePage != false){
        return confirmLeavePage;
    }
}

then all you have to do is to set confirmLeavePage to false when there are no modifications to the document.

Hope this helps.