How to show confirm message when form have been changed?

So I’m having this issue: I have a form which contain a lot of element. Whenever I change an element (for example, a textbox or a text area), then I go to another page, the browser will display a confirm message for me to confirm if I’m sure to exit.

Here is my simple form, not the real one:

<form action="/action_page.php">
  <label for="fname">First name:</label><br>
  <input type="text" id="fname" name="fname"><br>
  <label for="lname">Last name:</label><br>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Submit">
</form> 

So, when I edit the FirstName or the LastName and go out, the confirm message will appear. But when I delete all the changes and go out, the confirm message won’t appear anymore. And because of I also use my form when I insert and edit, I cannot just simply compare between the input fname and "" (For example) but I need to compare the original data and the new one.

Thank you very much.

44 thoughts on “How to show confirm message when form have been changed?”

  1. Try Like this:

    <input type="text" id="fname" name="fname" onfocus="fnm=this.defaultValue;" onblur="if(fnm!=this.value)confirm('Changed!');" >
    

    may Help!

    Reply

Leave a Comment