CODEWITHSUNDEEP
javascriptgoogle-analytics
drigby
drigby

Reputation: 61

Google Analytics ga function hitCallback is not firing

I'm trying to trigger an event in Google analytics for a client. The event needs to be triggered when the user clicks on a link to another website. The function call that was placed in onclick was not working on desktop because the page was getting unloaded before the Javascript could run. In order to fix it, I implemented the following code based on this article:

<script>
  function submitOrderButtion( eventName ){
    var url = 'https://example.com';
    var goToOrderForm = function(){
      console.log( "goToOrderForm" );
      window.location = url;
    };
    //setTimeout( goToOrderForm, 1000 );
    console.log( ga.q );
    console.log( ga.loaded );
    ga('set', 'transport', 'beacon');
    ga('send', 'event', 'order online', 'click', eventName, {
      hitCallback: goToOrderForm
    });
  }
</script>

The link that calls the function is this:

<a href="javascript:" onclick="submitOrderButtion( 'homepage' );" class="btn btn-primary">Order Online!</a>

The ga function never does anything when the button is clicked.

ga.q is undefined, and ga.loaded is true. I set the transport to 'beacon' for the last try, but it made no difference. Unless I uncomment the setTimeout (which I eventually will when this is working) the callback is never called, the ga event is never logged, and no network requests ever show up in the inspector.

Here is a link to the site Joey's Pizza. The link in question is the big button in the middle of the page that says "ORDER ONLINE!".

Can anyone tell me why the ga function is not doing anything? Thanks in advance for your help!

Status Update: I'm still looking for an answer to this. The answer I got has been tried multiple times (with various arg configurations, and checking the source to make sure previous tries were not cached). I've spent almost a days worth of work on what should be a simple task, and I'm not getting any errors or anything. Any further help would be very appreciated! Thank you :)

Upvotes: 4

Views: 2396

Answers (3)

Stephen Cook
Stephen Cook

Reputation: 181

I was encountering the same issue, and eventually found that I was missing a call to ga('create') before sending an event

ga("create", "UA-XXXXX-Y", "auto");
ga("send", "event", {
  eventCategory: "mycategory",
  eventLabel: "mylabel",
  transportType: "beacon",
  eventCallback: () => {
    ...
  },
});

Very frustratingly, if there's no tracker created, calls to GA send just do nothing, no errors, warnings, or anything useful!

Or, if like me you had ga in the global scope because of gtag being set up, you can just call the gtag global:

gtag("event", "click", {
  event_category: "mycategory",
  event_label: "mylabel",
  transport_type: "beacon",
  event_callback: () => {
    ...
  },
});

Upvotes: 2

Lukasz Madon
Lukasz Madon

Reputation: 14994

Check if any of browser plugins is blocking. Open the browser in incognito mode.

Upvotes: 0

Himan
Himan

Reputation: 379

Pass your callback as a 5th parameter

https://developers.google.com/analytics/devguides/collection/analyticsjs/sending-hits#hitcallback

So it should be something like this.

ga('send', 'event', 'order online', 'click', {
  hitCallback: goToOrderForm
});

Upvotes: -1

Related Questions