Daten per Query-String übergeben in Contact Form 7

Contact Form 7 ist ein extrem beliebtes Formular-Plugin. Über eine Millionen aktive Installationen. Dabei kann es auf dem ersten Blick gar nicht mit den großen Formbuilder-Plugins mithalten, die WordPress so zu bieten hat. Doch das Plugin punktet mit vielen Filtern, so dass es zahlreiche Plugins gibt, die das Plugin noch erweitern. Manche Erweiterung kann aber auch schnell selbst gebaut werden.

Bei einem Kunden benötigte ich die Weitergabe von Informationen eines Formulars an ein zweites Formular. Dazu muss das erste Formular nach dem erfolgreichen Verschicken des Formulars auf eine Erfolgsseite weiterleiten. Dazu bietet Contact Form 7 eine eigene Funktion an, die bei „Zusätzliche Einstellungen“ angegeben wird. Dabei wird ein Javascript-Befehl an ein Event (in diesem Fall das erfolgreiche Versenden des Formulars) gehängt.

on_sent_ok: "location = 'https://example.org/formular2/"

Um die Daten über einen Query-String weiter zu geben müssen die Formular-Daten noch serialisiert werden. Praktischerweise ist der Javascript-Befehl frei anzupassen und mit ein wenig jQuery-Magie, die ich auf StackOverflow gefunden habe, sind schnell sämtliche Formular-Felder angehängt:

$('form.wpcf7-form').serialize()

Schon ganz gut. Aber so werden auch alle versteckten Felder mit angehängt.

Contact Form 7 bietet aber auch das Hinzufügen von CSS-Klassen an, so dass unser jQuery angepasst werden kann, nur die Felder anzugeben, die zum Beispiel die Klasse wpcf7-param haben:

$('form.wpcf7-form .wpcf7-param').serialize();

Die vollständige Zeile sieht dann zum Beispiel so aus:

on_sent_ok: "location = 'https://example.org/formular2/?level=1&' + $('form.wpcf7-form .wpcf7-param').serialize();"

Als letzten Schritt muss nun nur noch das zweite Formular auch die Daten annehmen. Dazu wird dem Eingabefeld ein default:get hinzugefügt. Mehr Infos dazu stehen in der Doku von Contact Form 7.

So kann mit relativ einfachen Mitteln eine Datenübergabe zwischen zwei Formularen auch bei Contact Form 7 eingerichtet werden.

Du kennst noch mehr Tricks für CF7 oder praktische Zusatzplugin, dann ab damit in die Kommentare!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.