OnFormSubmit breaks form

[Mattg1]

I am trying to track form submissions using Google Analytics Events. So I am in the process of switching the form implementation from selected within modules to embedded scripts. To do this I am adding the onFormSubmit parameter and within I placed a Google Analytics event tracking snippet. I've linked articles to the documentation on each.

Here's what my code looks like:

<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
portalId: "XXXXX",
formId: "XXXXXXXXXXXXXXXXXXX",
onFormSubmit: function($form) {
     ga(‘send’, ‘event’, ‘Form’, ‘submit’, ‘BlogSubscribe’);

     }
});
</script>

But this code above does not output a form on my page.

If I comment out the onFormSubmit section, (just these 3 lines below) the form ends up working:

// onFormSubmit: function($form) {
// ga(‘send’, ‘event’, ‘Form’, ‘submit’, ‘BlogSubscribe’);
// }

What is wrong with the original code with the onFormSubmit parameter?

[mike-ward · Accepted solution]

Hi @Mattg1 ,

Doesn't look to be anything wrong with it to me. Are there any console errors when the page loads (you probably already know this, but right-click => inspect to load the dev tools in Chrome)?

Is JQuery being loaded on the page, and using its default $ namespace? Otherwise that $form reference won't work and could be the problem.

If you can share a test page that would be helpful to help debug a bit further (if you can!)

Cheers,

Mike

---

Did I answer your question? If your question is answered, please mark it as a solution. If you need more help, hit that big orange 'Reply' button!