JavaScript Confirm

LukOnline · 21. November 2011

Hallo,

ich möchte den Benutzer beim verlassen einer Seite darauf aufmerksam machen, dass ein Form noch nicht abgeschickt wurde und die Daten somit noch nicht gespeichert sind.

Nachdem ich mich etwas belesen habe, war klar, dass das eigentlich kein großes Ding sein sollte. Aber... es ist doch nicht ganz so leicht.

Mein Code:


                var message = "Sicher, dass du die Seite verlassen möchtest?";

                if(confirm(message)) 

                {

                    return true;

                }

                else

                {

                    return false;

                }

Ich bekomme zuerst meine Message angezeigt, wie es eben sein soll. Doch egal was ich klicke: Danach bekomme ich noch die andere Meldung gezeigt: Diese Seite bittet Sie zu bestätigen, dass Sie die Seite verlassen möchten â€“ Daten, die Sie eingegeben haben, werden unter Umständen nicht gespeichert.

Wieso kommen da 2 Meldungen? Ich habe schon etliche Beispiele probiert - immer das selbe...

Könnte mir bitte jemand helfen?

Vielen Dank, Lukas

Gooose · 21. November 2011

Du könnstest das onSubmit Event des Form Tags nutzen

<form method="post" action="xxx.htm" onsubmit="return IsConfirmed();")>

JavaScript:


function IsConfirmed {

    var message = "Sicher, dass du die Seite verlassen möchtest?";

    return confirm(message));

}

oder kurz

<form method="post" action="xxx.htm" onsubmit="return confirm('Sicher, dass du die Seite verlassen möchtest?');")>

confirm liefert schon true oder false zurück. Bei solchen Fragestellungen, wirf ein blick in die Dokumentation, oder baue dir ein minimales Beispielprojekt


<html>

<head>

	<title>Confirm Test</title>

</head>

<body>

	<form method="post" action="xxx.htm" onsubmit="return confirm('Yes?');")>

		<input type="submit" name="Name" value="Beschriftung">

	</form>

</body>

</html>

So etwas reicht zum testen schon aus.

LukOnline · 21. November 2011

OK, das hätte ich besser erklären sollen:

Ich habe ein Form.

Wenn etwas eingetragen wurde. Wird eine Var Changes auf true gesetzt. (via Onchange)

Wenn die Seite dann über irgendeinen Link, außer dem Submit-Button verlassen wird und Changes true ist, soll erst nochmal darauf hingewiesen werden, dass die Daten noch nicht gespeichert wurden.

Und dann sieht das folgendermaßen aus:


	window.onbeforeunload = function()

	{

	if(Changes)

	{

        var message = "Sicher, dass du die Seite verlassen möchtest?";

        if(confirm(message)) 

        {

        return true;

        }

        else

        {

        return false;

        }

	}

	}

Der Aufruf der Meldung läuft ja, aber:

Erst kommt meine eigene Meldung in einem Dialog, dann eine Zweite mit folgendem Text: Diese Seite bittet Sie zu bestätigen, dass Sie die Seite verlassen möchten – Daten, die Sie eingegeben haben, werden unter Umständen nicht gespeichert.

Die erste mit meinem Text ist Quasi wie wirkungslos.

Danke schonmal für deine Antwort.

Gruß Lukas

Gooose · 22. November 2011

Schau dir mal How can I override the OnBeforeUnload dialog and replace it with my own? an. Vielleicht kommst du in der Richtung weiter.

LukOnline · 22. November 2011

Hey, danke für deine Antwort.

Das schaue ich mir Zuhause mal an

Habe aber gestern noch bemerkt, dass es eben so funktioniert:

window.onbeforeunload = [COLOR=#00008b]function[/COLOR]() { 

    [COLOR=#00008b]return[/COLOR] [COLOR=#800000]'You have unsaved changes!'[/COLOR]; 

}

Nur mit Einschränkung - der Firefox lässt die Meldung so nicht überschreiben - das ist notfalls aber auch OK - da wird halt die Standard-Meldung angezeigt. Im IE wird dann die von mir definierte Meldung angezeigt.

Jetzt habe ich nur noch ein Problem: Wenn auf den Speichern-Button geklickt wird, soll diese Meldung natürlich nicht kommen. Kann ich irgendwie über das beforeunload-Objekt herausfinden, welches HTML-Element gedrückt wurde?

Gruß und einen wunderschönen Tag!

Lukas

lit-web · 22. November 2011

Warum machst du es dir selber so schwer? Nutze doch das für was JS eigentlich ideal ausgelegt ist, nämlich das DOM.

Da brauchst du den confirm Glatteradatsch nicht nutzen.

Wenn ein Fall eintritt dann blendest du einfach z.B. in Form einer LightBox eine Meldung ein.

Alert, Confirm und co braucht man heute nicht mehr.

kellerkindl · 22. November 2011

Alert, Confirm und co braucht man heute nicht mehr.

und gehört sich heutzutage auch nicht mehr, das Browserfenster wird dadurch blockiert.

LukOnline · 22. November 2011

Aber selbst wenn ich eine LightBox nehme - das oben genannte zweite Problem besteht weiterhin:

Jetzt habe ich nur noch ein Problem: Wenn auf den Speichern-Button geklickt wird, soll diese Meldung natürlich nicht kommen. Kann ich irgendwie über das beforeunload-Objekt herausfinden, welches HTML-Element gedrückt wurde?

lit-web · 22. November 2011

Aber selbst wenn ich eine LightBox nehme - das oben genannte zweite Problem besteht weiterhin:

Gib dem Element eine id und dann prüfe ob eine Event von getElementById(deineId) ausgelöst wurde. Schau dir mal die DOM Referenz von selfHtml an, da findest du, aber wirklich alles was du brauchst um mit JS auf dem DOM arbeiten zu können.

LukOnline · 22. November 2011

Eine ID hat der Button.

Ich weiß leider nicht, wonach genau ich suchen soll auf SelfHTML. Könnte mir jemand einen Ansatz geben?

Wie kann ich innerhalb von


	window.onbeforeunload = function()

	{


	}

auf die ID des Event-Auslösers zugreifen?

Danke, Lukas

Anmelden

JavaScript Confirm

Empfohlene Beiträge

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Link zu diesem Kommentar

Auf anderen Seiten teilen

Dein Kommentar

Fachinformatiker Jobs

Fachinformatiker.de, 2024 by SE Internet Services

Links

Fachinformatiker.de App

Kontakt

Social media u. feeds

Jobboard für Fachinformatiker und IT-Fachkräfte