Home/ Questions/Q 6001993
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-23T00:54:51+00:00

How do I let users know that there are changes left to be saved

  • 0

How do I let users know that “there are changes left to be saved on the form if they try to close the browser window?”
I have a form with couple of fields, Now if the user changes some of the fields and clicks on Close button on the browser window, my script should alert him of unsaved changes. How do I implement this? I have put in basic form validation but can’t seem to think of a solution for window.close() event. Any sample links would be helpful.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Well you could use the body onbeforeunload or onunload.

    <body onBeforeUnload="return(confirm('unsaved stuff'))">

    Never used a return to stop a page unload before but it should work.

    Update:

    In the header of the web page to make it a global var:

    <script type="text/javascript">
var formData = [];
function saveForm(){
    var data = [];
    for(var index = 1; index <= 3; index++){
        data [index - 1] = document.getElementById("textfield_" + index).value;
    }
    return(data);
}

function unsavedData(){
    var newFormData = saveForm();
    for(var index = 0; index < 2; index++){
        if(formData[index] != newFormData[index]){
            return(confirm("Unsaved data, do you really want to exit?"));
        }
    }
    return(true);
}
</script>

    In the body(of course):

    <body onBeforeUnload="return(unsavedData())">
...
<form ... onSubmit="formData = saveForm()">
<input type="text" id="textfield_1">
<input type="text" id="textfield_2">
<input type="text" id="textfield_3">
/*form submit button*/
</form>
    • 0