Analytics.js Form onsubmit Event Tracking

Question

I am using Universal Analytics for one of my Websites. I want to track an Analytics Event with an onsubmit on my form. The onsubmit is working perfectly, but the event is not tracked in analytics.

The form tag:

form onsubmit="ga('send', 'event', 'Formular', 'Submit', 'Contact')" id="contactform" class="news-form"  action="thankyou.html" method="post">

I think this is the right way to track events with the new analytics. Can anyone help me or give me some advice what to check?

Answer 1

The problem is that the request with the tracking information to analytics might or might not finish before the browser loads the next page. To avoid this you could use the hitCallback feature of universal analytics:

In some cases, like when you track outbound links, you might want to know when the tracker is done sending data. That way you can send a user to their destination only after their click has been reported to Google Analytics. To solve this, the send command allows you to specify a hitCallback function in the field name object that will execute as soon as analytics.js has completed sending data.

<a href='http://cool.com/' onclick="var href = this.href; ga('send','event','outbound','click', this.href, {'hitCallback': function(){document.location = href;}}); return false;">Cool</a>