[Erledigt] Formular-Submit entfernt dynamische DOM-Elemente

Raiden · 16.11.2009, 01:04

Hallo zusammen

Ich habe ein Formular zusammengestellt, in dem, außer einigen Textfeldern, auch eine Tabelle dynamisch erzeugt und ins DOM geschrieben wird.

Am Ende wird der Benutzer per confirm-popup gefragt, ob er die Eingabe bestätigen will.

Im Falle eines Abbruchs hab ich es regeln können, dass das Formular - optisch - unverändert bleibt.
Tatsächlich wird das Formular per submit abgeschickt, aber der Programmlauf, durch Verwendung eines hidden fields, in die richtige Weiche geschickt und ein history.back() ausgeführt.

Mein Problem ist, dass die Tabelle, welche ich dynamisch erzeuge und ins DOM schreibe, dann verschwunden ist.
Ist prinzipiell auch logisch, da die Eintragung ins DOM ja nur clientseitig ist.

Ich suche jetzt nach einer eleganten Möglichkeit, entweder die Tabelle wieder herzustellen oder aber den Reload der Seite durch das Submit zu unterbinden.

Eine Idee die Tabelle wieder herzustellen hätte ich eventuell. Man könnte beim Absenden des Formulars die Tabelle mit allen erzeugten Inhalten als Text in ein txt-file auf dem Server schreiben und nach dem reload wieder ins DOM schreiben.
Allerdings wär's praktisch, wenn es dafür auch eine andere, evtl. simplere Lösung geben würde.

nikosch · 16.11.2009, 01:28

Ajax.

Raiden · 16.11.2009, 01:57

Das Wort allein hilft mir jetzt nicht wirklich weiter, wie du dir vielleicht denken kannst

Generell hab ich bislang wenig Erfahrung mit Ajax gemacht, weshalb ich ohneweiteres auch nicht weiß, wie mir Ajax bei dem Problem helfen kann.

Daher wär' ein bisschen Textfleisch um den Begriff herum schon sehr hilfreich.

nikosch · 16.11.2009, 02:23

Nein. Die richtige Reaktion wäre, zu Wikipedia o. dergl. zu gehen und nachzulesen, was das Prinzip von Ajax ist.

Raiden · 16.11.2009, 03:07

Wie blöd von mir, dass ich das nicht gleich erkannt habe, wo du mir doch extra den ganzen Begriff als Antwort geschrieben hast ...

Ungeachtet dessen, weiß ich - zumindest in groben Zügen - um den Ablauf und das Prinzip von Ajax bescheid. Mir ist durchaus bekannt, dass man mit Ajax z.B. in der Lage ist, nur Bestandteile einer Seite dynamisch neu zu laden anstatt die ganze Seite.
Und trotzdem weiß ich leider nicht genau, wie mir das konkret in diesem Fall weiterhelfen kann. Oder besser gesagt, es übersteigt mein Können.
Ich habe mit Ajax bislang nur Daten dynamisch nachgeladen.

Wenn ich damit mehr anzufangen wüsste oder wüsste, wonach ich konkret suchen könnte, würde ich mich nicht an die Community eines solchen Forums wenden!

Deshalb wär ich wirklich dankbar, wenn du oder jemand anders hier mir einen Tipp geben könnte, wonach ich gezielt suchen muss, um der Lösung meines Problems näher zu kommen.

nikosch · 16.11.2009, 03:12

Ajax nimmt einen regulären Request vor. Der Aufruf erfolgt dabei seitens Javascript. Javascript kann gleichermaßen auf das DOM zugreifen. Du kannst also Dein aktuelles Form ohne die Seite zu verlassen absenden.

rudygotya · 16.11.2009, 07:41

Guten Morgen,

dafür brauchst du kein ajax.
Du läßt onload den input submit button ausblenden und ersetzt ihn durch einen input button. Dann kannst du nach dem ok mit der javascript Methode submit() das Formular abschicken.

Hier zum rumspielen:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />

<title>test</title>
<script type="text/javascript">
window.onload = function () 
{
    var submit,button;
    submit = document.forms[0].submitbutton;
    button = document.forms[0].jsbutton;
    submit.style.display = "none";
    button.style.display = "block";
}
var confirmSubmit = function () 
{
    var Check;
    Check = confirm("Wollen Sie diese Seite wirklich sehen?");
    if (Check === true) 
    {
        document.forms[0].submit();
    }
}
</script>


</head>
<body>
    <form id="test" action="#submitted" method ="post">
        <div>
            <input id="jsbutton" type="button" onclick = "confirmSubmit()" style="display:none" value="absenden" name="xyz" />
            <input id="submitbutton" type="submit" value="absenden" name="xyz" />
        </div>
    </form> 
    
</body>
</html>

mepeisen · 16.11.2009, 08:49

Rudygotya, dein Beispiel ist aus einem Grund unsinnig: Der Autor hat geschrieben, dass er die Seite nicht neu laden will, weil er dann seine zuvor dynamisch erzeugten DOM-Elemente verliert. Dein Beispiel macht nichts anderes als das Formular per JavaScript abzuschicken, was ebenfalls vollständig die Seite neu lädt...

rudygotya · 16.11.2009, 09:44

Nein, es sendet doch nur, wenn du bestätigst. Oder eben kein js erlaubst. Beim Abbrechen passiert gar nichts. Und das wollte er doch erreichen. Les nochmal seinen Ausgangspost. Im IE könnte man den submit auch anders abfangen, funktioniert aber leider nicht in anderen Browsern.

edit:

ergänzend dazu vielleicht noch folgendes: in vielen Fällen kann man auch so den submit abfangen und muss nicht einfaden:

Code:

window.onsubmit = function () 
{
    var Check;
    Check = confirm("Wollen Sie diese Seite wirklich sehen?");
    if (Check === true) 
    {
        document.forms[0].submit();
    }
    return false;
}

Allerdings funktioniert das Beispiel nicht überall, z.b. im IE 8, Opera 6/7 sollte auch nicht gehen (nicht sicher)

edit2: vielleicht hätte ich eine andere form action wählen sollen, vielleicht hat dich das verwirrt

mepeisen · 16.11.2009, 10:41

Naja, Hmmm. Kann man vielleicht auch so verstehen. Ich habe es so verstanden, dass die Tabelle grundsätzlich nicht verloren gehen darf. Naja. Irgendwas von den Kommentaren wird dem Autor schon helfen

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
PHP: Formular Generator	Zergling-new	Tutorials	16	06.07.2010 03:14
[Erledigt] Submit Formular über Frame - Daten kommen nicht an	timok	PHP Tipps 2009	3	05.10.2009 16:15
[Erledigt] Formular Submit, Variable laden	krackmoe	PHP Tipps 2009	5	01.07.2009 15:57
Formulardaten werden nach Klick auf submit gelöscht!	Yadgar	PHP Tipps 2009	2	15.06.2009 13:22
Wert aus Textfeld in neues Formular übernehmen (kein Submit)	PsychoEagle	HTML, Usability und Barrierefreiheit	9	02.01.2007 14:51
JS: Action von Formular bei Submit in neuem Fenster	PsychoEagle	HTML, Usability und Barrierefreiheit	7	14.12.2006 09:28
Formular abschiken ohne Submit Button	shocky	HTML, Usability und Barrierefreiheit	10	02.11.2006 21:53
[Erledigt] Formular in Formular		HTML, Usability und Barrierefreiheit	4	19.10.2005 12:18
Variable aus Formular ohne submit Button übergeben		PHP Tipps 2005-2	3	24.06.2005 17:08
Formular Submit in eigenem Browserfenster oder Popup	Bronks	HTML, Usability und Barrierefreiheit	4	04.11.2004 17:43
[Erledigt] Formular, Submit, PHP - Hab ein kleines Problem		PHP Tipps 2004	2	10.07.2004 13:50
Formular per image (Submit) abschicken...	18inch	PHP Tipps 2004	1	26.06.2004 12:17

16.11.2009, 01:04
Raiden Benutzer Registriert seit: 13.06.2009 Beiträge: 58 PHP-Kenntnisse: Anfänger	[Erledigt] Formular-Submit entfernt dynamische DOM-Elemente Hallo zusammen Ich habe ein Formular zusammengestellt, in dem, außer einigen Textfeldern, auch eine Tabelle dynamisch erzeugt und ins DOM geschrieben wird. Am Ende wird der Benutzer per confirm-popup gefragt, ob er die Eingabe bestätigen will. Im Falle eines Abbruchs hab ich es regeln können, dass das Formular - optisch - unverändert bleibt. Tatsächlich wird das Formular per submit abgeschickt, aber der Programmlauf, durch Verwendung eines hidden fields, in die richtige Weiche geschickt und ein history.back() ausgeführt. Mein Problem ist, dass die Tabelle, welche ich dynamisch erzeuge und ins DOM schreibe, dann verschwunden ist. Ist prinzipiell auch logisch, da die Eintragung ins DOM ja nur clientseitig ist. Ich suche jetzt nach einer eleganten Möglichkeit, entweder die Tabelle wieder herzustellen oder aber den Reload der Seite durch das Submit zu unterbinden. Eine Idee die Tabelle wieder herzustellen hätte ich eventuell. Man könnte beim Absenden des Formulars die Tabelle mit allen erzeugten Inhalten als Text in ein txt-file auf dem Server schreiben und nach dem reload wieder ins DOM schreiben. Allerdings wär's praktisch, wenn es dafür auch eine andere, evtl. simplere Lösung geben würde. __________________ Es gibt Tage da verliert man und es gibt Tage da gewinnen die anderen ...


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

16.11.2009, 01:28
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 34.256 PHP-Kenntnisse: Fortgeschritten	Ajax. __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --

16.11.2009, 01:57
Raiden Benutzer Registriert seit: 13.06.2009 Beiträge: 58 PHP-Kenntnisse: Anfänger	Das Wort allein hilft mir jetzt nicht wirklich weiter, wie du dir vielleicht denken kannst Generell hab ich bislang wenig Erfahrung mit Ajax gemacht, weshalb ich ohneweiteres auch nicht weiß, wie mir Ajax bei dem Problem helfen kann. Daher wär' ein bisschen Textfleisch um den Begriff herum schon sehr hilfreich. __________________ Es gibt Tage da verliert man und es gibt Tage da gewinnen die anderen ...

16.11.2009, 02:23
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 34.256 PHP-Kenntnisse: Fortgeschritten	Nein. Die richtige Reaktion wäre, zu Wikipedia o. dergl. zu gehen und nachzulesen, was das Prinzip von Ajax ist. __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --

16.11.2009, 03:07
Raiden Benutzer Registriert seit: 13.06.2009 Beiträge: 58 PHP-Kenntnisse: Anfänger	Wie blöd von mir, dass ich das nicht gleich erkannt habe, wo du mir doch extra den ganzen Begriff als Antwort geschrieben hast ... Ungeachtet dessen, weiß ich - zumindest in groben Zügen - um den Ablauf und das Prinzip von Ajax bescheid. Mir ist durchaus bekannt, dass man mit Ajax z.B. in der Lage ist, nur Bestandteile einer Seite dynamisch neu zu laden anstatt die ganze Seite. Und trotzdem weiß ich leider nicht genau, wie mir das konkret in diesem Fall weiterhelfen kann. Oder besser gesagt, es übersteigt mein Können. Ich habe mit Ajax bislang nur Daten dynamisch nachgeladen. Wenn ich damit mehr anzufangen wüsste oder wüsste, wonach ich konkret suchen könnte, würde ich mich nicht an die Community eines solchen Forums wenden! Deshalb wär ich wirklich dankbar, wenn du oder jemand anders hier mir einen Tipp geben könnte, wonach ich gezielt suchen muss, um der Lösung meines Problems näher zu kommen. __________________ Es gibt Tage da verliert man und es gibt Tage da gewinnen die anderen ...

16.11.2009, 03:12
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 34.256 PHP-Kenntnisse: Fortgeschritten	Ajax nimmt einen regulären Request vor. Der Aufruf erfolgt dabei seitens Javascript. Javascript kann gleichermaßen auf das DOM zugreifen. Du kannst also Dein aktuelles Form ohne die Seite zu verlassen absenden. __________________ -- One pixel is still too big. Please make it smaller. ASAP. Initiative Mittelstand. Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers. --

16.11.2009, 08:49
mepeisen Erfahrener Benutzer Registriert seit: 21.12.2004 Beiträge: 4.651 PHP-Kenntnisse: Fortgeschritten	Rudygotya, dein Beispiel ist aus einem Grund unsinnig: Der Autor hat geschrieben, dass er die Seite nicht neu laden will, weil er dann seine zuvor dynamisch erzeugten DOM-Elemente verliert. Dein Beispiel macht nichts anderes als das Formular per JavaScript abzuschicken, was ebenfalls vollständig die Seite neu lädt... __________________ Entwickler aus Leidenschaft und ein Zahnrad in einem der größten Java-Projekte der Welt.

16.11.2009, 09:44
rudygotya Erfahrener Benutzer Registriert seit: 28.05.2008 Beiträge: 1.898 PHP-Kenntnisse: Fortgeschritten	Nein, es sendet doch nur, wenn du bestätigst. Oder eben kein js erlaubst. Beim Abbrechen passiert gar nichts. Und das wollte er doch erreichen. Les nochmal seinen Ausgangspost. Im IE könnte man den submit auch anders abfangen, funktioniert aber leider nicht in anderen Browsern. edit: ergänzend dazu vielleicht noch folgendes: in vielen Fällen kann man auch so den submit abfangen und muss nicht einfaden: Code: window.onsubmit = function () { var Check; Check = confirm("Wollen Sie diese Seite wirklich sehen?"); if (Check === true) { document.forms[0].submit(); } return false; } Allerdings funktioniert das Beispiel nicht überall, z.b. im IE 8, Opera 6/7 sollte auch nicht gehen (nicht sicher) edit2: vielleicht hätte ich eine andere form action wählen sollen, vielleicht hat dich das verwirrt __________________ ++++ Wieder einer ins Netz gegangen: Phishers Fritz zufrieden ++++ Blog Geändert von rudygotya (16.11.2009 um 09:56 Uhr).

16.11.2009, 10:41
mepeisen Erfahrener Benutzer Registriert seit: 21.12.2004 Beiträge: 4.651 PHP-Kenntnisse: Fortgeschritten	Naja, Hmmm. Kann man vielleicht auch so verstehen. Ich habe es so verstanden, dass die Tabelle grundsätzlich nicht verloren gehen darf. Naja. Irgendwas von den Kommentaren wird dem Autor schon helfen __________________ Entwickler aus Leidenschaft und ein Zahnrad in einem der größten Java-Projekte der Welt.