Formular per Javascript verschicken


<script language="JavaScript" type="text/javascript">


In diesem Beispiel wird das Formular nicht per HTML verschickt sondern mit einem Javascript Befehl. versendet. Dadurch hat man die Möglichkeit vor dem Verschicken diverse Kontrollstrukturen unterzubringen oder Bedingungen abzufragen. Man könnte so auch ein Formular programmieren, welches durch Anklicken verschiedener Buttons, die Eingaben an jeweils eine andere Adressen schickt. Oder die Auswahl eines Radiobuttons bestimmt die Adresse, an die das Formular verschickt wird. Die Daten werden hier auf einer PHP Seite empfangen.

Ich habe hier nicht die Standardbuttons type="submit" und type="reset" verwendet sondern type="button" und beiden einen onClick Event mit Funktionsaufruf zugewiesen.

Text Field:

HTML

<form name="form1" method="post">
<input type="text" name="eingab" id="eingab">
<input type="hidden" name="punkte">
</form>
<input type="button" value="Senden" onClick="senden()">
<input type="button" value="Reset" onclick="resetForm()">


Javascript

<script>
        function senden() {
            document.form1.action = "formulaAbhol.php";
            document.form1.punkte.value = 4;
            document.form1.submit();           
        }

        function rueckSetz() {
           document.form1.reset();
        }
 </script>

Man sieht, die Javascript Methoden submit() und reset() und außerdem wird auch action per Javascript zugewiesen.

Dem versteckten Formularfeld type="hidden" mit name="punkte" wurde der Wert 4 zugewiesen.

Der Zugriff auf das Formular erfolgt über den Formularnamen document.form1 . Alterntativ könnte man den Zugriff auf das erste Formular der Seite folgendermaßen definieren: window.document.forms[0]. Mehr Möglichkeiten des Zugriffs auf HTML Elemente mit Javascript unter DOM.

Das Empfangen der Formulardaten per PHP wird in meinen PHP Tipps Formular erläutert

 

---

 

Javascript Tipps