Neu laden der Seite nach submit verhindern!??

[Hannes Weninger]

Hallo,

ich hab meine Webseite neu gemacht und hab mich für eine "OnePage" entschieden - es steht alles auf einer Seite und mit jQuery slide ich zum jeweiligen Thema, wenn man auf einem Menüpunkt klickt - das klappt einwandfrei.

Mein Problem ist nur das Kontaktformular. Wenn jemand die Form ausfüllt und dann auf Absenden klickt, wird die Seite neu geladen und das ist für meine Seite unschön, da die Form ganz unten auf der Seite ist und wenn der abscend- Button geklickt wurde, ist man wieder ganz oben.

Ich hätte jetzt die Möglichkeit, eine Weiterleitungsseite anzugeben, also das man nach dem Absenden der Form auf einer neuen Seite landet - das möchte ich aber wenn möglich vermeiden.

Weiß jemand wie man das "Neuladen" einer Seite verhindern kann nach dem klicken des "Absende- " Buttons?

Eine Idee von mir war auch, dass ich die email mit Javascript versende - da war aber die Unwissenheit größer als die Idee - das geht natürlich mir reinem Javascript nicht.

Wäre euch dankbar für Hinweise, wie ich dieses Problem lösen kann.
(PS: ich verwende übrigens das CMS Contao und da gibts noch keine wirkliche Unterstützung für OnePages und die, dies gibt, hab ich noch nicht verwendet - sind noch im beta- stadium o.ä.)

lg und Danke,
Hannes

[Doktor Knallcharge]

Wenn jemand die Form ausfüllt

Das Formular, bitte. Mit Formen kannst du im Sandkasten spielen.

und dann auf Absenden klickt, wird die Seite neu geladen und das ist für meine Seite unschön

Wenn deine Seite ohne Javascript eh nicht funktioniert, möchtest du vermutlich das Formular selbst mit "return false" abbrechen und, natürlich vor dem return, die Daten stattdessen per Ajax/XHR versenden.
Ansonsten gebe dem Formular ein id-Attribut und benutze als es als Ziel-URL (zB <form id="formular" action="#formular" method="post">).

[Hannes Weninger]

Danke, ich werd mir das mal ansehen.
Ich vermute, dass das CMS da im Hintergrung noch einiges setzt vor dem Abschicken.

[Texter mit x]

Mein Problem ist nur das Kontaktformular.

Ich vermute, dass das CMS da im Hintergrung noch einiges setzt vor dem Abschicken.

Chaos Messaging System

SCNR

[Matthias Apsel]

Om nah hoo pez nyeetz, Hannes Weninger!

Weiß jemand wie man das "Neuladen" einer Seite verhindern kann nach dem klicken des "Absende- " Buttons?

verhindern nicht. Ein Großteil der Seite sollte ohnehin im Cache sein.

<form action="//example.com/index.html#Formular"> könnte zumindest dafür sorgen, dass du wieder beim Formular ankommst. Das setzt voraus, dass dein Formular (oder das Element, das dann dann ganz oben im Browserfenster sein soll) eine entsprechende ID bekommt.

Matthias

[molily]

Hallo!

Formulare kannst du mit XMLHttpRequest im Hintergrund abschicken, wenn du nicht willst, dass eine neue Seite vom Server geladen wird.

Du kannst das submit-Ereignis überwachen und erst einmal die Standardaktion unterdrücken. Dann holst du dir mit serialize die Formulardaten und schickst einen POST-Request mit einem Body vom Typ application/x-www-form-urlencoded ab. Damit baust du im Grunde das Standardverhalten des Browsers nach. Ich gehe mal davon aus, dass du ein Formular vom Typ <form method="POST" action="…">…</form> hast.

Mathias

[Hannes Weninger]

Ich gehe mal davon aus, dass du ein Formular vom Typ <form method="POST" action="…">…</form> hast.

Hallo,

ja, genau das hab ich. Ein Problem ist weiters, dass ich an die "action" des Formulars nicht rankomm, da ich ein CMS verwende und keine Mögl. besteht, "action" zu setzen.

Das zweite Problem das ich hab ist, dass ich die URL nicht weis, wo ich den Request abschicken soll -> also worst case momentan.

die form schaut so aus:

  
<form id="contactForm" method="post" enctype="application/x-www-form-urlencoded">  
    <div class="formbody">  
              <input type="hidden" name="FORM_SUBMIT" value="auto_form_3">  
        <input type="hidden" name="REQUEST_TOKEN" value="2987e2ea8e96a47edc7ff5abbca54fd4">  
  
<input type="hidden" name="Name" value="Name">  
<input type="hidden" name="Email" value="Email">  
<input type="hidden" name="Telefon" value="Telefon">  
...  
danach kommen die Eingabefelder  

Ich hoff ich kann diesen Gordischen Knoten bald lösen :-)

lg
Hannes

[molily]

Ein Problem ist weiters, dass ich an die "action" des Formulars nicht rankomm
<form id="contactForm" method="post" enctype="application/x-www-form-urlencoded">

Ohne action kann ein Formular nicht abgeschickt werden. Irgendwoher muss die action kommen. Wird sie vielleicht mit JavaScript gesetzt? Schau dir einmal in den Developer-Tools das entstehende DOM an, nicht bloß den HTML-Quelltext.

Mathias

[Steel]

Moin!

Ohne action kann ein Formular nicht abgeschickt werden. Irgendwoher muss die action kommen. Wird sie vielleicht mit JavaScript gesetzt? Schau dir einmal in den Developer-Tools das entstehende DOM an, nicht bloß den HTML-Quelltext.

@molily: Ich denke vielmehr, dass Hannes damit meint, dass das Formular von seinem CMS generiert wird und er deshalb das Attribut nicht bearbeiten kann.

@Hannes: Du scheinst ja deiner Seite beliebig JS unterschieben zu koennen. Dann kannst Du damit auch das action Attribut bearbeiten, falls es ueber das generierte HTML nicht geht.

Ich frage mich allerings ob Deine Seite ohne JS ueberhaupt noch funktioniert.