How can I Confirm to leave the page when someone insert / editing a form in php

I'm creating an PHP web application and I want to implement logic to warn the user when they are navigating away from a page they've edited. I found some solution on the web .


For this solution we bound a JavaScript function to the unload event:

 window.onbeforeunload  

I use following code in different aspect
For all type of Input .

$(document).ready(function() { 
    $(":input").one("change", function() { 
        window.onbeforeunload = function() { return 'You will lose data changes.'; } 
    }); 
    $('.noWarn').click(function() { window.onbeforeunload = null; }); 
});

Your input elements probably do not exist when the code is executed. Try using the .live function to detect changes on all input elements, or wrap your code in a $(document).ready() handler.

$('input').live("change", function () {
    window.onbeforeunload = function () { return "Your changes have not been saved?" };
});

For specific input type on body

$(document).ready(function() {

    //----------------------------------------------------------------------
    // Don't allow us to navigate away from a page on which we're changed
    //  values on any control without a warning message.  Need to class our 
    //  save buttons, links, etc so they can do a save without the message - 
    //  ie. CssClass="noWarn"
    //----------------------------------------------------------------------
    $('input:text,input:checkbox,input:radio,textarea,select').one('change', function() {
        $('BODY').attr('onbeforeunload',
        "return 'Leaving this page will cause any unsaved data to be lost.';");
    });

    $('.noWarn').click(function() { $('BODY').removeAttr('onbeforeunload'); });

});

Best solution for form base: In this solution if you are change something in your form then when you want to leave from this page user can get a message for confirmation.

function formIsDirty(form)
      {
          for (var i = 0; i < form.elements.length; i++)
          {
              var element = form.elements[i];
              var type = element.type;
              if (type == "checkbox" || type == "radio")
              {
                  if (element.checked != element.defaultChecked)
                  {
                      return true;
                  }
              }
              else if (type == "hidden" || type == "password" || type == "text" ||
                       type == "textarea")
              {
                  if (element.value != element.defaultValue)
                  {
                      return true;
                  }
              }
              else if (type == "select-one" || type == "select-multiple")
              {
                  for (var j = 0; j < element.options.length; j++)
                  {
                      if (element.options[j].selected !=
                          element.options[j].defaultSelected)
                      {
                          return true;
                      }
                  }
              }
          }
          return false;
      }

      window.onbeforeunload = function(e)
      {
          e = e || window.event;  
// You put your from ID
          if (formIsDirty(document.forms['fromid'])) 
          {
              // For IE and Firefox
              if (e)
              {
                  e.returnValue = "You have unsaved changes.";
              }
              // For Safari
              return "You have unsaved changes.";
          }
      };