Doppeltes Abschicken von Formularen unterbinden

Nur eine Idee oder Gedankenanstoß, wie man das doppelte Abschicken von Request auf relativ einfache Art unterbinden kann.

<div id="unloadoverlay"></div>
<script type="text/javascript">
  onbeforeunload = function () {
    $("unloadoverlay").focus();
    $("unloadoverlay").addClassName("phase1");
    (function () {
      $("unloadoverlay").addClassName("phase2");
    }).delay(0.25);
    (function () {
      $("unloadoverlay").removeClassName("phase1");
      $("unloadoverlay").removeClassName("phase2");
    }).delay(10);
  }
</script>

Anmerkungen: Ich habe prototype.js auf der Seite eingebunden.

Idee: Sobald der Browser versucht eine neue Seite zu laden, wird ein DIV über die ganze Seite gelegt und somit ein weiterer Klick auf die Seite oder Buttons abgefangen.

Hier noch die entsprechenden Styles dazu.

#unloadoverlay {
  display: none;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
}
#unloadoverlay.phase1 {
  display: block;
}
#unloadoverlay.phase2 {
  cursor: wait;
}
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s