CQ_Analytics.record on component onload

[homervillanueva]

I am following below instruction [1] how to submit an event after page loads.

[1] http://docs.adobe.com/docs/en/cq/5-6-1/developing/extending-cq-analytics.html#Tracking%20Custom%20Ev...

My use case is to record an image ad impression so what i did is to attach the triggering of event on image onload. I created a component called adbanner and it has below JS code on each instance. Each adbanner component is wrapped in a div with a given unique id.

<div id="cq-ad_fVV75"><img title="Must Know" alt="Must Know" class="img-responsive center-block" src="/content/mysite/en/home/_jcr_content/section3ad2/adbanner.img.jpg/1429087979100.jpg"/></div>

$("#cq-ad_fVV75 img").load(function(){
        console.log("ad loaded cq-ad_fVV75");
        CQ_Analytics.record({
                event: "adImpression", 
                values: {adName: "ad_300_100_must_know" }, 
                collect: false, 
                options: { obj: this }, 
                componentPath: "mysite/components/content/general/adbanner"
            });
    });    

Above implementation is just doing fine when there is only one adbanner component in a page, however the issue arise when there is already multiple instance in one page.

Although from the console log i can see all the image onload executed successfully because I can see multiple console log which shows the "add loaded cq-ad_<uinique_id>", the thing is that I can only see one event being triggered and it always contains the value (adName) of the last component loaded.

Below is the single event trigger that i can see from the chrome console sitecatalyst debugger

SiteCatalyst Server Call #1 (450 chars)

Report Suite ID    : xxxxxxxxxxxxxxxxxxx
Page Name          : Home
Current URL        : /content/mysite/en/home
Events             : event4
eVar4              : ad_300_220_test_ad
Currency Code      : USD
Char Set           : UTF-8
Screen Resolution  : 1920x1200
Color Depth        : 24
JavaScript Version : 1.6
JavaScript Enabled : Y
Cookies Supported  : Y
Browser Width      : 1858
Browser Height     : 761
Version of Code    : H.26.2
Data Centre        : xxxxxxxxxx.xxxxx.sc.omtrdc.net

By the way adImpression is mapped to event4 and adName is mapped to eVar4 .

I hope someone can lead me to the correct way of doing this.

Any input is highly appreciated.

Thanks!

[Sham_HC · Accepted solution]

From symptoms looks like there is internal implementation to guard against duplicate. Are you sure that for each record you need to pass same value?  If so can you please file daycare with actual requirements.  For now can you change value to be unique and then verify. 

Additionally you can debug yourself by enabling breakpoints on record function. Also which aem version?

[homervillanueva]

Hi All,

Thanks Sham HC for the response. I got it resolved. 

I just need to wait for the event sitecatalystAfterCollect to get triggered before others can make a call.

 $CQ(document).on("sitecatalystAfterCollect",function(){

    // CQ_Analytics.record({});

 });   

BTW I am using AEM 6.0 SP1. Yes each evar4 value must be a unique value.