jQuery: undo things when history:back?

Question

hey guys, i know this question might be too easy, but i have no idea how to solve this.

when submitting a form i'll fadeIn a Loading-Image. When submitting the form was a success the page redirects blabla...

Now when I hit the BACK Button in my browser and i visit the previous page with the form the Loading-Image is still shown.

How can i make that hide again?

regards

Answer 1

Assuming you're sending this via ajax since you get a loading screen. Just attach the image to hide on success.

$.ajax({
  url: 'ajax/form.html',
  beforeSend: function() {
    $('.loadingImage').fadeIn("slow");
  }
  success: function() {
    $('.loadingImage').fadeOut("fast");
  };
});

Answer 2

Why not do something as simple as this?

$(document).ready(function() {
    $('.loadingImage').hide();
});

Just making sure that when your page is loaded your image is hidde.

Answer 3

If you're actually submitting the form, then yes, you're unloading the page.

$(function(){
  $(window).unload(function(){
    $('.loadingImage').hide();
  });
});

That'll hide it before you actually leave the page.

Answer 4

and what if you do a POST/Redirect/GET, which solves the duplicate form submitting as well?