How can I track custom Javascript events

This is a technical article aimed at users who wish to track ‘custom’ javascript events within the browser, for example: tracking that a visitor hovered over an element or triggered something within the DOM. By default CANDDi tracks all interactions between a web-browser and the server:

• Page views
• Form submissions
• Off-site links
• Video views
• Document downloads
• etc...

However, on occasion you may wish to track other ‘non-browser to server’ events, for example: the visitor triggers a pop-up; hovers over a text area; or triggers a focus event on a button.

CANDDi's Javascript Tracker has a full open API which enables tracking of "any" event within your application. Trap the event within your own javascript:

<a href="XXX" onclick="javascript:fnClick()">
or
$("element").onClick(function(){})

Trigger a call to the CANDDi API (NOTE: we recommend wrapping this to ensure that the CANDDi object has loaded.)

if(window.canddi) {window.canddi.sendEvent(strName,objElement,bNewGoal,strGoalType,strURL,strTrackerGoalTitle);}

• ‘strName’ is the Title of the event
• ‘objElement’ is a javascript hash {key1:value1, key2:value2} of parameters.
• bNewGoal (boolean value) set to false
• strGoalType is used internally by CANDDi - default to ‘event’
• strURL This is the URL to display as the ‘page’
• strTrackerGoalTitle This is the title that you wish the Event to have when displayed within CANDDi

Example:

if(window.canddi){window.canddi.sendEvent("Register",{Name:"Tim Langley","Email":"tim@canddi.com"},false,"event","https://www.canddi.com","Register for new Event");}

Have more questions? Contact us at hello@canddi.com or 0161 414 1080

Updated on: 05/06/2020