✔ onbeforeunload bei Verlassen einer PHP-Seite

T

toadkopf

Mitglied
Hallo zusammen,

ich habe ein Shop-System "modified": Ich will für unseren Vertrieb einstellen, dass, wenn man eine Bestellung tätigt, immer das Formular absendet bevor man die Seite verlässt.

D.h. ich habe eine PHP-Seite orders_edit.php. Wenn diese geöffnet wird soll das window.onbeforeunload Event gesetzt werden. Dieses soll erst auf null gesetzt werden wenn das Formular submitted wurde. Danach kann man die Seite ohne ein window.onbeforeunload Event verlassen. Wenn man das Formular nicht submitted hat dann soll eine Meldung kommen ob man sicher ist das man die Seite verlassen will (am besten verbieten die Seite zu verlassen).

Ich habe einen Ansatz aber das funktioniert noch nicht so wie ich das will, vielleicht kann mir hier jemand helfen?

Code: 
<script>
$(document).ready(function(){
  window.onbeforeunload = function(e){
    alert("EVENT");
    return("Seite verlassen?");
  }
  $('#isSaved').submit(function(e){
    window.onbeforeunload = null;
    return confirm('abschicken?');
  });
});
</script>
 
Javascript: 
$(document).ready(function()  {
  $(window).bind('beforeunload', function()  {
    return 'Seite wirklich verlassen?';  // Diese Zeile ist eher dokumentarischer Natur und bewirkt nichts
  });
});
 
hallo erik s.

danke für die Antwort. Das ist leider noch nicht das was ich mir genau vorstelle. Wenn ich das Formular absende soll das beforeunload Event nicht mehr kommen.

Wie kann ich das Event löschen beim Submit des Formulars?
 
Ja das wird natürlich extrem kompliziert ...
Ich kann dir (auch und gerade zum Zwecke des Selbststudiums) die Doku zur jQuery-(API)-Bibliothek, zum Beispiel für unbind() empfehlen.

Deinem Eröffnungspost entnehme ich mal, dass die ID des Formulars, welches hierbei von Bedeutung ist, 'isSaved' ist. Wie du das Formular dann prüfst etc. ist ja wieder dir überlassen.

Javascript: 
$(document).ready(function()  {
  $(window).bind('beforeunload', function()  {
    return 'Seite wirklich verlassen?';  // Diese Zeile ist eher dokumentarischer Natur und bewirkt nichts
  });

  $('#isSaved').bind('submit', function()  {
    $(window).unbind('beforeunload');
    // hier dein restlicher Formular-verarbeitender Quelltext ...
  });
});

Falls das nicht klappt, probier das click-Event des Submit-Buttons abzufangen und darin den unbind()-Befehl abzusetzen.
 
Ob es einfacher geht weiß ich nicht. Aber du könntest in der Submit-Funktion eine global gültige Variable auf TRUE setzen.

Javascript: 
var sub = FALSE;
$(document).ready(function()  {
  $(window).bind('beforeunload', function()  {
    if (sub == FALSE) return 'Seite wirklich verlassen?';  // Diese Zeile ist eher dokumentarischer Natur und bewirkt nichts
  });

$('#isSaved').submit(function(e){
    sub = TRUE;
  });
});
 
Code: 
$('#isSaved').bind('submit', function()  {
    $(window).unbind('beforeunload');
    // hier dein restlicher Formular-verarbeitender Quelltext ...
  });

so weit so gut. Laut diesem Code sollte das beforeunload-Event doch = NULL sein. Warum kommt das bei mir trotzdem immer noch obwohl ich den submit Button getätigt habe?

@tombe:

das mit der Variablen klappt nicht, durch die Variable kommt er erst garnicht in das Event rein
 
Also in meinem Testscript funktioniert's. Gibt die Fehlerkonsole einen Hinweis? Funktioniert es, wenn du (wie schon erwähnt) das click-Event des Submit-Buttons direkt belegst?
 
was ich nicht so ganz verstehe ist folgendes:

Mit diesem Code:
Code: 
$(document).ready(function()  {
  $(window).bind('beforeunload', function()  {
    return 'Seite wirklich verlassen?'; 
  });
  $('#isSaved').submit(function(e){
    $(window).unbind('beforeunload');
    return confirm('abschicken?');
  });
});

Mit diesem Code funktioniert es fast so wie ich will. Allerdings nicht ganz!
Wenn ich hier das Formular jetzt absende kommt die confirm Nachricht wo man "OK" und "Abbrechen" drücken kann. Wenn ich hier jetzt auf "Abbrechen" drücke ist beim nächsten Verlassen der Seite per Click das Event auf NULL. Bei Drücken auf "OK" ist das Event noch da. Das ist doch komisch oder? Das sollte doch gerade anders herum sein?
 
Das Problem ist, dass du wahrscheinlich beim Abschicken des Formulars die Seite verlässt (und neulädst). Das musst du natürlich unterbinden, indem du z.B. deine Daten per Ajax an das entsprechende Script schickst und bei positivem Feedback das unbind() ausführst.

Mit
Javascript: 
return confirm('abschicken?');
gibt die Funktion genau den bool'schen Wert zurück, den du mit Klicken von OK/Abbrechen erhältst. Damit das Abschicken des Formulars unterbunden wird, muss die Funktion false zurückliefern, sonst wird das im ACTION-Attribut des Formulars hinterlegte Script aufgerufen und die Seite verlassen. Da du vorher schon den unbind()-Befehl abgesetzt hast, kommt auch keine Nachfrage zum Verlassen der Seite mehr.

Ausreichend erklärt?
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück