Trying to override onbeforeunload in first step of form wizard

Question

This pertains to a form wizard with 5 steps, I don't want the user to hit back and lose form data in any step 2-4. I have added a flag for the submit function and need to add this one for the first step. If they get there by accident and try and leave I dont want the cofirm dialog popping up.

<script type="text/javascript">
    $(document).ready(function(){
      var action_is_post = false;
    $("form").submit(function () {
    action_is_post = true;
 });

//this is the trouble spot. on the first step the "navigation" of the form has a class 
//of current (on step one = current)
$(this).ready(function () {
if ($("#stepDesc0").is(".current")) {
action_is_post = true;    
}
);   

window.onbeforeunload = confirmExit;
function confirmExit()
{
if (!action_is_post)
return 'Using the browsers back, refresh or close button will cause you to lose all
form data. Please use the Next and Back buttons on the form.';
}
});
</script>

Answer 1

The variable action_is_post is declared local to $(document).ready() and it is in a different scope when it reaches the function confirmExit(). Therefore it is undefined and hence false in the conditional. Try adding the declaration outside the $(document).ready() as shown below:

var action_is_post = false;
$(document).ready(function(){
    $("form").submit(function () {
    action_is_post = true;
});

This makes the variable global and it should behave the way that you expect.

---

EDIT: I checked the code in your page and it is very convoluted and difficult to follow. My recommendation is to simply run the comparison checking for the class in your confirmExit() function again, instead of checking the value of the action_is_post variable.

  window.onbeforeunload = confirmExit;
  function confirmExit()
  {
    if (!$("#stepDesc0").hasClass(".current"))
      return 'Using the browsers back, refresh or close .....';
  }