Replies posted by Richard_Makara

2 Replies

Noah
NoahFormer Unbouncer
posted in Tips & Scripts

[How to] Run Custom Code/Scripts on Form Submission

Not sure about the data layer question - it’s just an array of stuff i can push into and it resets on every page load. But in effect i set up the workflow as follows: Tag 1: Above script runs on all pages. So both functions get registered with the unbounce hooks. New Trigger: Custom event: ub-form-success New data layer variables for fields i care about e.g email => {{Form Submission - Email}} which references the key i set up on the datalayer => ‘form-email’ Tag 2: Triggered on ‘ub-form-success’ and the script just constructs the event properties I need to send to our cdp. afterFormSubmit runs before the page reloads / is redirected so I have enough time to grab what i need from datalayer and send over. But yeah, :+3: for documentation comment

28
Anna_Z
Unbouncer
4 months ago
Noah
NoahFormer Unbouncer
posted in Tips & Scripts

[How to] Run Custom Code/Scripts on Form Submission

This post should be pinned / highlighted / promoted / to save others time I spent good day and a half bashing my head against the wall with capturing Unbounce form submission values into a data layer (and then sent as event props to our CDP). beforeFormSubmit and afterFormSubmit hooks are the way to go here 👍 <script> window.ub.hooks.beforeFormSubmit.push(function(args) { var email = args.formElement.querySelector('input#email'); dataLayer.push({ 'event': 'unbounce-form-submission', 'form-email': email.value, }) }); // This is used as a trigger for another tag to do your work BEFORE the datalayer gets cleared window.ub.hooks.afterFormSubmit.push(function() { window.dataLayer.push({ 'event': 'ub-form-success' }); }); </script>

28
Anna_Z
Unbouncer
4 months ago

Badge winners

Show all badges
Terms & ConditionsCookie settings