Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 228
  • Last Modified:

How to detect form-field change when window-close

Have a form with several fields.

Is it possible to detect if any of the fields in the form changed content since it was first displayed.
If changes where made I want to display the client with a message i.e. like this "You have made changes, do you want to save the record?".... (YES) ... (NO)...

And that this check is only done when the user tries to close (and if possible) leave the window that holds the form.

Would prefere this to be done in JavaScript.
And that it works both in NS and IE.

Erot

0
erot
Asked:
erot
  • 5
  • 5
  • 2
  • +3
1 Solution
 
a.marshCommented:
The way I always do this is to use a global flag and only check it if the user clicks on a link on the page e.g.

<html>
<head>
<script language="javascript">

altered = false;

function checkAltered(){
  if(altered){
    return confirm("You have altered the form. Are you sure you want to leave?");
  }

  return true;
}

</script>
</head>
<body>
<p>
<a href="page1.html" onClick="return checkAltered();">page 1</a>
<a href="page2.html" onClick="return checkAltered();">page 2</a>
<a href="page3.html" onClick="return checkAltered();">page 3</a>
</p>
<hr>
<form>
<input type="text" value="" onChange="altered = true;"><br>
<input type="text" value="" onChange="altered = true;"><br>
<input type="submit">
</form>
</body>
</html>

Ant
0
 
a.marshCommented:
In terms of the user closing the browser, well you can use the same code above, but this is where you start hitting problems with cross-browser compatibility.

You could try using the onunload event in the <body> tag e.g.

<body onunload="return checkAltered():">

but then you'll probably now want the browser warning appearing etc.etc. (unless the window you are working in was opened by your page using window.open()) and there is little you can do about that. :o)

I personally always convince my clients (if they need this kind of functionality) that it is better stick with controlling what is in the page and not outside of it if they want their code to work properly in different browsers.

Hope this helps.

:o)

Ant
0
 
a.marshCommented:
Sorry, that should say "not want" instead of "now want".

Ant
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
Michel PlungjanIT ExpertCommented:
IE:
onBeforeUnload="if (altered) returnValue='Are you sure'"
0
 
a.marshCommented:
I was going to mention that too Michel, but I've got a sneaky feeling there is going to be a strong emphasis on everything working the same in IE and NS....nightmare!!!

<offtopic>

How are you getting on with achieving the required 3000 points each month?

It's just that I remember you mentioning what a nightmare you thought it could be when they first set up the policy for having EEKPro for free.

:o)

</offtopic>

:o)

Ant
0
 
podishettyCommented:
I have a hidden variable as my global variable defaulted to N, ao any changes on the form update it to Y and while exiting or closing the window check this hidden varible value if its "Y" implies somechanges are there to save, so alert a message as you want.
<html>
                     <head>
                     <script language="javascript">

                      function checkAltered(){
                      document.from1.alteredflag.value = 'Y';

                      return true;
                     }

                     function subform(){
               var flag =document.from1.alteredflag.value;
                           if(flag == 'Y'){
                             return confirm("You have altered the form. Are you sure you want to leave?");
                         }
               return true;
                     }

                     </script>
                     </head>
                     <body>
                     <form name = "form1">
                     <input type="text" value="" onChange="checkAltered();"><br>
                     <input type="text" value="" onChange="checkAltered();"><br>
                     <input type="submit"  onClick="return subform()">
                     <input type="hidden" value="N" Name="alteredflag">
                     </form>
                     </body>
                     </html>
0
 
podishettyCommented:
I have a hidden variable as my global variable defaulted to N, ao any changes on the form update it to Y and while exiting or closing the window check this hidden varible value if its "Y" implies somechanges are there to save, so alert a message as you want.
<html>
                     <head>
                     <script language="javascript">

                      function checkAltered(){
                      document.from1.alteredflag.value = 'Y';

                      return true;
                     }

                     function subform(){
               var flag =document.from1.alteredflag.value;
                           if(flag == 'Y'){
                             return confirm("You have altered the form. Are you sure you want to leave?");
                         }
               return true;
                     }

                     </script>
                     </head>
                     <body>
                     <form name = "form1">
                     <input type="text" value="" onChange="checkAltered();"><br>
                     <input type="text" value="" onChange="checkAltered();"><br>
                     <input type="submit"  onClick="return subform()">
                     <input type="hidden" value="N" Name="alteredflag">
                     </form>
                     </body>
                     </html>
0
 
a.marshCommented:
erot, please reject the proposed answer.

I think you've missed some of the point there podishetty - when the form gets submitted it doesn't matter if things have been altered!!!

Ant
0
 
bebonhamCommented:
oh ...that is the same script he got done using to lock up some other q's ...he must of forgotten to delete the flag part out of it.
0
 
Michel PlungjanIT ExpertCommented:
podishetty: You seem to have been member long enough to know that proposing an answer (and a wrong one at that - and even worse - reusing code given by an expert in a previous comment) is not on after comments have been given.

Michel
Ant: I actually do not conciously try to reach 3000 points - I just hope I will not loose status if I do not reach them - I have been off EE for a while and then back on and have not been hunting points for a long while
0
 
MoondancerCommented:
This question is LOCKED with a Proposed Answer.  If it helps you, great, accept it and grade it to close.  If not, reject it and comment as to why or what else is needed.

Few additional experts will join this collaboration effort, once a question has been locked.  Just want to confirm this to you.  If more than one expert helps you, you can always split points or award additional help in a new question, within the same topic area.  If you need help from us, post a zero point question here, and include the link:

http://www.experts-exchange.com/jsp/qList.jsp?ta=commspt

Moondancer
Community Support Moderator @ Experts Exchange

P.S.  Double click your Member Profile, expand VIEW HISTORY to navigate and update all your open questions please.
0
 
Michel PlungjanIT ExpertCommented:
Moondancer: I think a single click on the member name would suffuce ;-)

Michel
0
 
MoondancerCommented:
Points for mplugjan - qid=20266971
Finalized today due to a total lack of response by asker.

Thanks, Michel, modifed the script.

Moondancer
Community Support Moderator @ Experts Exchange
0
 
francis_tudlongCommented:

Guys:

I am implementing an event in which it will show a popup window that contain several questions to answer. This event will only display after i close the browser. But i have a problem. When i refresh tha page it will show the popup window and if i press a link on the page again it will show the popup window. It should only display the popup window if i close the page. How can i implement this in javascript..

Thanks
Francis
0
 
Michel PlungjanIT ExpertCommented:
1. Not really possible (detecting the page closing can be done with an ugly hack that measures the window size - I do not know if it still works)

2. Please ask the question in the forum for maximum support.

Michel
0
 
francis_tudlongCommented:
Hi guys i got the the answer for my question. This code will open a popup window if you're going to close the (X) button of the window. here is the code. thanks for the adviced.


<html>
<head>
<title>splash page</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
<!--
function RorC(theURL,winName,features){
  var top=self.screenTop;
   if(top>9000){
   window.open(theURL,winName,features);
   }
}
function MM_openBrWindow(theURL,winName,features) { //v2.0
if(document.all){
RorC(theURL,winName,features);
}else{
var top=window.outerWidth;
if(top==0){
window.open(theURL,winName,features);
}}
}
//-->

</SCRIPT>
</head>
<body onUnload="MM_openBrWindow('exitpage.php','exitpage','width=300,height=400')">
<div align="center"><font size="2" face="Verdana, Arial, Helvetica, sans-serif"><strong>Try
  to refresh the window will not popup . try to click the link still the window
  will not popup. it will only popip if you close the browser. Without this script,
  all events in this page will trigger the window to popup.</strong></font> </div>
<FORM NAME="myForm">
  <div align="center">
    <INPUT TYPE="hidden" VALUE="" NAME="check">
    <a href="http://www33.brinsker.com/softcomputing">Link to my page</a> </div>
</form>
</body>
</html>
0
 
Michel PlungjanIT ExpertCommented:
Yep "with an ugly hack that measures the window size "
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

  • 5
  • 5
  • 2
  • +3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now