Contact Form 7 ist ein verbreitetes WordPress-Plugin um verschiedenste Formulare zu erstellen und wurde hier im Blog auch schon bedacht.
Nachfolgend wird dargestellt, wie man mehrere Formulare verketten kann und dabei Werte von einem zum nächsten Formular übernimmt.
Hintergrund war eine Anforderung, einen Fragebogen mit mehreren Fragen in einzelnen Blöcken = Formularen mit jeweils nur einem Teil der Fragen aufzuteilen und so z.B. Thematisch zu gruppieren.
Auf diese Art entstehen zwar auch mehrere Mails, der Vorteil ist jedoch, dass diese auch gezielt (z.B. je Themenbereich) getrennt an unterschiedliche Empfänger versand werden können… genau genommen also ein Vorteil, je nachdem, wie man es sieht! 😉
Folgende Schritte sind notwendig:
1. Vorbereitung der Felder, welche an das Folgeformular übergeben werden sollen.
Innerhalb des Formulars müssen alle Felder, welche im nächsten Schritt per URL-Parameter an das Folgeformular übergeben werden sollen mit einer entsprechenden und eindeutigen (!) ID versehen werden.
Über den Tag-Generator ist das ziemlich einfach, dort wird das Feld ID schon vorgegeben.
Im Tag/Feld selbst würde das dann z.B. so aussiehen: [text Name id:name]
Hier wird also dem Textfeld „Name“ die ID „name“ zugewiesen.
Tipp: WordPress nutzt diese Parameter teilweise von Hause aus ebenfalls. Deshalb kann es bei der Verwendung von Feldnamen die WordPress schon kennt durchaus zu einem 404-Fehler führen, die Seite wird also nicht gefunden. Deshalb bei Auftreten eines solchen Fehlers mal mit einer anderen ID arbeiten. (Infos)
Das ist schon alles, was hier im ersten Schritt notwendig ist.
2. Weiterleitung zum nächsten Formular inkl. der Übergabewerte bei Formularversand
Im Formular wird dann die Standardfunktion zur Weiterleitung nach dem erfolgreichen Mailversand erweitert und würde für unser Beispiel z.B. so aussehen:
on_sent_ok: "var textinhalt = document.getElementById('text').value; location = 'https://www.wischonline.de/?text=' + textinhalt;"
Eingefügt wird dieser Codebaustein im Formular selbst im Feld „Zusätzliche Einstellungen“, am Seitenende der Formularverwaltungsseite.
Technisch gesehen wird hier per JavaScript der Feldinhalt des Feldes mit der genannten ID ausgelesen und als URL-Parameter übergeben.
3. Übernahme der Übergabewerte ins Folgeformular
3a. Mit Standardmitteln
In der PlugIn-Dokumentation ist ein entsprechender Hinweis zu finden, der so in der Formualarerstellung nicht erkennbar ist.
Dem jeweiligen Feld muss als Defaultwert schlicht der Wert get mitgegeben werden.
Der damit erreichte Effekt erfüllt genau die gewünschte Vorgabe: Es wird nach einem Parameterwert in der URL gesucht, bei dem der Feldname dem des aktuellen Feldes entspricht. In unserem Beispiel wäre das Feld im Folgeformular also wie folgt zu integrieren:
[text Name id:name default:get]
3b. Via zusätzlichem PlugIn
Eine weitere Möglichkeit der Wertübernahme aus der URL in Felder des (Folge-) Formulars bietet das PlugIn Contact Form 7 Dynamic Text Extension.
Dieses PlugIn bietet noch weitere Möglichkeiten der dynamischen Befüllung… kann also ggf. als Alternative sinnvoll sein.
Nach der Installation stehen innerhalb von Contact Form 7 zwei weitere Felder zur Verfügung. Diese unterscheiden sich darin, dass eines als verstecktes (hidden) also unsichtbares Feld genutzt werden kann. Ansonsten können hier die Werte genau so gesetzt und auch weitergegeben werden, wie oben beschrieben.
In unserem Beispiel würde ein sichtbares Feld dann im Folgeformular z.B. so aussehen:
[dynamictext info id:info "CF7_GET key='info'"]
Das Feld bekommt also die selbe ID wie im vorherigen Formular, womit auch der Code aus Punkt 2 gleich bleibt.
Über die neue Funktion des zusätzlichen PlugIns wird direkt der übergebene Wert als Inhalt vorbelegt.
Als verstecktes Feld würde es dann so aussehen:
[dynamichidden info id:info "CF7_GET key='info'"]
Mit dieser Umsetzung können nun mehrere Formulare verkettet und die genannte Anforderung erfüllt werden.