Why is Google Analytics event not sent from onSubm

Question

I'd like to track how often users download files using Analytics' events, but even though the events seem to have been sent, the tracking .gif doesn't seem to be arriving properly.

To download files, users are required to fill out a brief form. The information entered into this form is checked by the function checkSubmit() (which returns false when the entered info is invalid or incomplete, true when the information is good to be submitted). Once submitted, the user is redirected to the file.

<script>
function checkSubmit() {
    …
    if(dataIsGood) {
        _gaq.push(['_trackEvent', 'Download', 'the_filename.xxx']);
        return true;    //allow the form to submit
    } else {
        _gaq.push(['_trackEvent', 'Form', 'info not okay']);
        return false;   //keep the form from being submitted
    }
}
</script>

<form action="/form/emailcaptureform" method="post" onSubmit="return checkSubmit();">
… </form>

In the Chrome console, the Google Analytics Tracking Debugger says Download event tracking beacons have been sent, but the console says it failed to load resource __utm.gif

This happens only with events pushed just before the form is submitted. Events work elsewhere on my site—including the Form event pushed when the form info is no good (in the else block above)

The Analytics snippet seems to be working, accepting _trackPageviews and _trackEvents.

The request URL for __utm.gif is well-formed: copy-and-pasting the URL from the gadebug output into the location bar returns __utm.gif without a hitch.

The event is pushed without issue when pushed from another element. For example:

<a href="#" onClick="_gaq.push(['_trackEvent', 'Download', the_filename.xxx']);">Event!</a>

Pushing the event, pausing for a few seconds, then returning true does not seem to have any effect—beyond adding a pause before submitting the form.

Do you have solutions or suggestions?

Answer 1

Javascript is single threaded. When you execute _gaq.push, you are pushing something on to a queue to be handled later. However your code returns true before 'later' comes, and the GA code never gets to execute (because the next action is to go to the next page).

I'd suggest that this may be an appropriate moment to use traditional or synchronous tracking with ._trackEvent