Am 14. September 2017 haben wir eine überarbeitete Fassung unserer Datenschutzrichtlinie veröffentlicht. Wenn Sie video2brain.com weiterhin nutzen, erklären Sie sich mit diesem überarbeiteten Dokument einverstanden. Bitte lesen Sie es deshalb sorgfältig durch.

HTML-Tipps für Webentwickler: Jede Woche neu

formaction, formmethod und formvalidate

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Unabhängig davon, ob es sich bei Ihrem Projekt um eine "große" Website handelt oder eine "kleine", Sie einen Webshop aufsetzen wollen oder einen privaten Blog betreuen – eines haben alle Webseiten gemeinsam: die Basis ist HTML. Profitieren Sie in dieser praktischen Tipps&Tricks-Sammlung von der jahrelangen Erfahrung der Trainerin Florence Maurice, die Ihnen unbekannte Features nahe bringt, zur Übersicht über die einzelnen Versionen verhilft oder oftmals nur mit kleinen, pfiffigen Hinweisen Ihren Alltag als Webdesigner und -programmierer erleichtert.
07:14
  Lesezeichen setzen

Transkript

Was mit den Formulardaten aus einem Formular geschehen soll, legen Sie im Form-Start-Tag fest. Manchmal möchte man je nach Situation unterschiedliche Aktionen ausführen, dafür gibt es eine Reihe von Attributen. Nehmen wir an, Sie haben in einem Formular zwei Buttons und je nachdem, auf welchen Button man klickt, soll eine andere Aktion ausgelöst werden, dann können Sie dafür "formaction" verwenden. Folgendermaßen funktioniert das: Normalerweise werden Formulare an die Adresse gesendet, die beim Form-Start-Tag angegeben ist, bei "Action", wenn Sie aber bei einem Absendebutton beispielsweise "formaction" angeben, dann können Sie dort eine andere Adresse spezifizieren und wenn man auf diesen Button klickt, werden die Daten dann an diese angegebene Adresse gesendet. Ich habe ein Formular, bei "Action" ist angegeben "verarbeitung_1.php", das ist ein einfaches PHP-Skript, das macht nichts Anderes, als dass es ausliest, wie der Skriptname lautet, wie die Übertragungsmethode heißt und außerdem werden die Daten ausgegeben. Da ist mein Absendebutton und dann gibt es einen weiteren Absendebutton, dort schreibe ich "formaction" und gebe ein anderes Skript an, nämlich "verarbeitung_2.php". Sehen wir uns das in Aktion an, ich schreibe bisschen was hier rein, "Frodo Beutlin" und wenn ich auf "Absenden" gehe, bin ich in diesem Skript "Verarbeiten 1.php", wenn ich hingegen auf den anderen Button klicke, dann wird das andere Skript aufgerufen. Ich habe diesen beschriftet mit "an den Support", man kann sich eben vorstellen, dass unterschiedliche Aktionen ausgelöst werden sollen, das Eine ist das Normale und das Andere ist, wenn es beispielsweise ein Problem gibt, dass man dann die Daten direkt an den Support senden schicken kann. Die Browser-Unterstützung für dieses Attribut sieht gut aus, das Inden wir bei Wufoo und Sie sehen überall grüne, schöne Häkchen, also das funktioniert browserübergreifend. Im Prinzip ähnlich funktioniert das Attribut "formmethod", nur verwenden Sie dieses, um die Übertragungsmethode zu überschreiben. Bei meinem Form-Static habe ich "method=get" geschrieben und bei meinem Input-Button möchte ich das überschreiben und habe angegeben "formmathod=post". Wir testen das einmal aus, also wieder Frodo, ich gehe auf "Absenden" und sehe, die Übertragungsart ist "GET", und dann gehe ich "Absenden mit post", entferne das an dieser Stelle mal, sodass wir das Formular wieder ganz normal haben und gehe dann auf "Absenden mit post", und wir sehen, die Übertragungsmethode ist post. Ebenfalls praktisch ist "formnovalidate". Was hat es damit auf sich? Ich lösche das einmal hier raus. Ich habe mein Formular, bei dem habe ich ergänzt "required" bei Vorname und Nachname, außerdem gibt es ein Feld vom Typ E-Mail und das bedeutet, dass automatisch eine Überprüfung stattfindet, ob die beiden Felder ausgefüllt sind, und bei E-Mail, ob ich auch wirklich eine E-Mail-Adresse, die formal korrekt ist, eingegeben habe. Also wenn ich da auf "Absenden" gehe, bekomme ich eine Fehlermeldung, wenn das Feld nicht ausgefüllt ist, und wenn ich hier irgendwas hinschreibe, das hier fülle ich auch aus Beutlin und das ist natürlich keine E-Mail-Adresse, wenn ich auf "Absenden" gehe, erhalte ich dann eine Meldung. Das ist sehr praktisch, jetzt kann es aber natürlich Fälle geben, wo ich sage, ich möchte diese Überprüfung nicht haben. Ein Beispiel wäre, wenn es ein komplexes Formular ist und es möchte den Besuchern auch die Möglichkeit geben, den Zwischenstand zu speichern, um meinetwegen später weiterzumachen, dann ist es natürlich nicht sinnvoll, beim Speichern des Zwischenstandes das Ganze schon zu überprüfen, weil dann wird es ja nicht vollständig sein. Dann wäre es praktisch, man hätte einen Button und wenn man auf diesen Button klickt, dann findet keine Überprüfung statt. Und genau das macht das Attribut "formnovalidate". Ich zeige es einmal in Aktion, ich klicke auf Absenden ohne Prüfung und es hat geklappt. Sehen wir uns den zugehörigen Code an, das Entscheidende ist dieses Attribut "formnovalidate", und wenn ich das bei einem Absendebutton angebe, so wird in diesem Moment das Formular nicht überprüft. Wenn Sie möchten, dass prinzipiell das Formular nicht überprüft werden soll, dann können Sie auch "novalidate" beim Form-Start-Tag schreiben, dann gilt das auch, wenn man auf den normalen Button klickt. Sehen wir uns die Browser-Unterstützung für dieses Attribut an, dann ist es an dieser Stelle bei Wufoo etwas durchwachsen, weil es beispielsweise im Safari nicht funktioniert. Das liegt aber daran, dass diese Versionen von Safari überhaupt nicht die Überprüfung vollständig implementiert haben, in diesem Punkt gibt es aber eine Änderung, weil im Dezember 2016 schon angekündigt wurde, dass das jetzt in WebKit funktionieren wird, die Formular-Überprüfung wird nun im WebKit unterstützt und funktioniert auch in Safari ab Version 10.1. Wenn Sie die globale Aktion bei Formularen überschreiben wollen, sind verschiedene Attribute nützlich: "fomaction" überschreibt die Action des Form-Start-Tags, "formmethod" überschreibt die Method der Formular-Start-Tags und mit "formnovalidate" können Sie verhindern, dass die automatische Überprüfung in HTML 5 stattfindet.