Hubspot submissions fire twice on Google Tag Manager

Viewed 73

I was wondering if someone have had this type of issue when tracking form submissions from a hubspot form. To give you some context, our client' site is an SPA and has x3 different Hubspot form. The solution I applied to track form submissions was to create a Custom HTML HubSpot Success Listener Tag, and then I created a look-up table to pass the form ID in a more friendly way.

The issue I'm having is that when I debug this implementation and subscribe to more than one form during the same session, the second submission duplicates:

enter image description here enter image description here

I know I can configure the tag to fire once per event, instead of once per page. However, I don't want to lose the ability to count a second form during the same session because it's possible a user will want to fill out one form to receive information and another form to arrange a meeting.

Should I get the web developers involved to implement a dataLayer push for each form?

Thanks.

1 Answers

First, you want to debug your existing solution. You don't need GTM for it, though you can still use it. For the debugging, you will want to know what HS returns in their callback on form submission.

Just open your console, paste a listener that would show you the payload coming with it and inspect it:

window.addEventListener("message", function(event) {
    console.log(event.data);
});

You will see something like this:

enter image description here

This indicates that we get three callbacks on form submission. You can listen for any of these.

Ah, looks like I'm getting the same form IDs that you have on your screenshot. Now, I'm not sure where that ID comes from. It's likely your developers and not HS are responsible for form IDs. I don't imagine HS could make such a trivial mistake. So ask the devs to change the form ids.

If they can't set unique ids for the forms, then yes, they will have to push custom events there.

Related