Caro: Javascript: Linkklick nachträglich ungültig machen

Hallo,

ich habe folgendes Problem. Ich habe ein Formular, dass relativ lang ist und einen Chef, der Angst hat, dass der Benutzer am Ende vergessen könnte zu speichern und dann all die schönen Eingaben weg wären. Der Benutzer soll also irgendwie gewarnt werden, wenn er auf der Seite einen Link anklickt, bevor er nicht das Formular gespeichert hat.
Ich hatte also die Idee, in den <body>-Tag Folgendes zu schreiben:
------------------
echo '
<body ';
if (Meine Bedingung X)
 echo 'onunload="warnFormExit()"';
echo ' >
';

und die Funktion warnFormExit() sieht so aus:
-------------------
function warnFormExit(){
 Check = confirm("Du hast deine Eingaben noch nicht gespeichert. Bist du sicher, dass du diese Seite verlassen willst?");
 if (Check == false)
   stop();
}

Nur macht das stop() nicht das, was ich mir bei der Funktion gedacht habe. Ziel ist es, dass der Benutzer mit einem Confirm-Alert gewarnt wird, wenn er auf einen anderen Link klickt, um die Seite zu verlassen bevor er sein Formular gespeichert hat. Klickt er im Confirm auf YES, géht sein Klick auf den Link durch, Klickt er auf NO, dann soll GAR NICHTS PASSIEREN, also quasi der Klick auf den Link rückgängig gemacht werden. Mit history.back hab ichs auch schon versucht, aber da springt er mir immer um 2 Seiten zurück und die Formulardaten sind futsch.

Ich muss doch wohl nicht alle Links in meinem Fenster mit einem onclick-Event ausstatten, das schaut, ob das Formular gespeichert wurde und wenn nicht, ne Aktion wie document.links[0].target = "_blank"; schmeißt?

Vielleicht kann mir jemand helfen.

Viele Grüße

Caro

  1. Hallo!

    Schreib ganz einfach:

    <body onUnload="DeineWarnung()">

    Gruß Richard

    1. Hallo!

      Schreib ganz einfach:

      <body onUnload="DeineWarnung()">

      Was hätte er davon? Sein Problem ist ja, daß es dann schon zu spät ist...

  2. Hallo,

    onbeforeunload ist das Stichwort.

    Mathias

  3. Hallo,

    Nur macht das stop() nicht das, was ich mir bei der Funktion gedacht habe. Ziel ist es, dass der Benutzer mit einem Confirm-Alert gewarnt wird, wenn er auf einen anderen Link klickt, um die Seite zu verlassen bevor er sein Formular gespeichert hat.

    Bringe möglichst wenig verlockende Links in der Nähe eines solchen Formulars unter.

    Ich muss doch wohl nicht alle Links in meinem Fenster mit einem onclick-Event ausstatten, das schaut, ob das Formular gespeichert wurde

    Doch, anderes geht es nicht für Browser, die onbeforeunload nicht kennen.

    und wenn nicht, ne Aktion wie document.links[0].target = "_blank"; schmeißt?

    Das wäre nicht so elegant.

    Versehe die Links mit onclick-Handlern - spätestens dann dynamisch, wenn Formulareingaben gemacht wurden (das heißt, wenn onchange-Ereignisse bei den Formularfeldern passieren). Mit return false; in einem Event-Handler kann man bewirken, dass die Standardaktion, die das Ereignis auslösen würde (im Fall eines Klicks auf einen Link: Die Zielseite wird annavigiert), unterdrückt wird. Bei <a href="link" onclick="return false">...</a> wird der Link also unwirksam gemacht.

    Die entsprechenden JavaScript-Schnipsel:

    function formularaenderung () {
       formular_geaendert = false;
    }

    <input onchange="formularaenderung()"

    function formularpruefung () {
       if (formular_geaendert)
         var check = confirm("Du hast deine Eingaben noch nicht gespeichert. Bist du sicher, dass du diese Seite verlassen willst?");
         if (!check)
            return false;
       }
    }

    <a href="..." onclick="return formularpruefung()">...</a>

    Das Problem dabei ist, dass (fast) jeder Link ein onclick-Handler haben muss. Die kann man entweder als HTML-Attribute notieren oder dynamisch vergeben, indem man document.links durchläuft und .onclick = formularpruefung; ausführt.

    Eleganter ist es, alle Klicks auf das Dokument abzufangen (document.onclick = handler;) und zu prüfen, ob schon Formulareingaben gemacht wurden und es sich um Klicks auf verbotene a-Elemente handelt. Das geht über Ereignisobjekt.target bzw. Ereignisobjekt.srcElement. Dann kann man in dieser Handler-Funktion mit return false die besagte Standardaktion verhindern.
    Eine ähnliche Funktion (zu einem anderen Zweck) habe ich einmal unter http://molily.de/css-position-fixed#javascript-alternative geschrieben.

    Allerdings wäre dieser Aufwand ja nur für Browser nötig, die kein onbeforeunload kennen, das sind meinen Wissens vor allem Opera und Safari.

    Mathias