I'm trying to send Event Tracking values using labels set by code behind variables. It all renders correctly on the page, however, it does not actually track those events. The dynamic events do not display in GA under the Events area, but the hardcoded "Download" event does.
If I try this, only the first "Download" event shows in GA:
$('#DownloadButton').on('click', function () {
var s1 = "<%= Var1 %>";
var s2 = "<%= Var2 %>";
var s3 = "<%= Var1 %> | <%= Var2 %>";
ga('send', 'event', 'button', 'click', 'Download');
//these next variable labels never are received in GA
ga('send', 'event', 'cat1', 'v1', s1);
ga('send', 'event', 'cat2', 'v2', s2);
ga('send', 'event', 'cat3', 'both', s3);
});
If I put the server vars inline, then the "Download" and the Var1 get sent, but not the last two:
$('#DownloadButton').on('click', function () {
ga('send', 'event', 'button', 'click', 'Download');
ga('send', 'event', 'cat1', 'v1', "<%= Var1 %>");
//these last two never get received by GA
ga('send', 'event', 'cat2', 'v2', "<%= Var2 %>");
ga('send', 'event', 'cat3', 'both', "<%= Var1 %> | <%= Var2 %>");
});
It seems like it breaks after it hits the end of "<%= Var1 %>".
Var1 is a name like "Gala Apple" and renders correctly on the page:
ga('send', 'event', 'sheet', 'Side1', "Gala Apple");
GA has this tool on the chrome store:
It allows you to see what it is sending to the GA servers. To use it, open chrome, enable the debugger, then open your console tab in the developer tools. When you load the page and trigger events, it should log them to the window.
If you watch it when clicking the #DownloadButton
it should shed some light on what's happening. My guess is, it's not reaching those lines because your button has another click
handler attached to it that changes the page location, or does something to stop execution. Since js is single-threaded, depending on how long it takes, it may leave the page before it can finish sending your other tracking beacons.