Triggering JS code when a Data Layer variable gets populated?

Bronze Contributor
Bronze Contributor

Is there any solution for executing some extension code based off a data layer variable getting populated? I'm missing out on some events that look for utag.data.order_id, and trying to figure out the best way to avoid missing them.

 

It could be a timing issue, but if there's a way to trigger based off that order_id getting populated, I'd be all set.

 

Thanks!

10 REPLIES 10

Triggering JS code when a Data Layer variable gets populated?

Silver Contributor
Silver Contributor

Hey @nickmv,

 

How is order_id currently getting populated? If it's populated as part of the utag_data layer, you should be able to hook onto it in an extension.

 

Cheers,

Jon

Triggering JS code when a Data Layer variable gets populated?

Bronze Contributor
Bronze Contributor

Hey @leejon, It is populated backend + eCom extension (_corder).

 

When you say 'hook onto' it, what exactly do you mean? I know I can reference it. My current JS code checks for a regex match on URL pathname, as well as looking for utag.data.order_id that is not blank or null or undefined.

 

It works 70% of the time, but seems to miss out on some. I figure it's a timing issue, so I need some way to trigger off the population of that value.

Triggering JS code when a Data Layer variable gets populated?

Silver Contributor
Silver Contributor

Hey @nickmv

My initial solution would have been to use a set data values extension that executes when order_id is populated.
It seems you've already thought of that but you're still experiencing some issues.
Could you send a screenshot of your current code or extension?

Thanks,
Jonathan

Triggering JS code when a Data Layer variable gets populated?

Gold Contributor
Gold Contributor
Hello @leejon,

I presume you can try using below solution to populated the tag on time without any delay via JS extention.

document.onload = setTimeout(function(){
(your code)
}, 1000);

if we use Set timeout function we can populate the values on expected time to trigger it.

Hope it helps! Kindly let me know if you need any clarifications on this to proceed further.

Thanks!

Triggering JS code when a Data Layer variable gets populated?

Tealium Expert
Tealium Expert

Since TealumIQ is working page by page the eCommerce extension variables will populate also on a page basis. Using the eCommerce variables directly, like _corder for example, has not worked reliably for me. I guess that is a timing issue. Instead I just use fields I know are populated/not populated once the page loads, like the field you have mapped to _corder. If you trigger on that you could pop your js code into an extension or even easier in a generic tag, @nickmv.

(To try to trigger whilst on a page, when a specific variable is actually populated I would think is pretty much impossible and unpredictable.)

Triggering JS code when a Data Layer variable gets populated?

Employee Emeritus

Hi, @nickmv, would you mind sending us a screenshot like @leejon mentioned. It would help us greatly. Thank you!


@leejon wrote:

Hey @nickmv

My initial solution would have been to use a set data values extension that executes when order_id is populated.
It seems you've already thought of that but you're still experiencing some issues.
Could you send a screenshot of your current code or extension?

Thanks,
Jonathan

Remember to give me a kudo if you like my post! Accepting my post as a solution is even better! Also remember that search is your friend.

Triggering JS code when a Data Layer variable gets populated?

Bronze Contributor
Bronze Contributor

Sorry, I've been a bit busy and also trying some of the methods listed here.

My implementation is basically a JS script that inserts a script into the top of <body> using a jQuery prepend function, referencing a JS variable that is essentially the entire script, 'escaped.' Then later on in the main script (not the one inserted), I have logic that checks for values and sends push events as necessary, using methods and functions that were defined in the inserted script.

The logic for sending off a push event for a purchase is currently as follows (whole thing executes on DOM Ready):

//eCom sale submission event
if (utag.data.order_id != "") {
$CVO.push(['trackEvent', {
type: 'ecom-sale-raw',
id: utag.data.order_id,
amount: utag.data.order_subtotal
}]);

I don't believe there are any issues with it sending blanks. Instead, the only issue is that it doesn't seem to always be picking up transactions, since GA sometimes shows up to 25-30% more transactions (and their IDs). That suggests a timing issue.

 

Currently I am trying a method that was suggested above, and that is to execute a 1000ms setTimeout on the checks for these values. I'm pretty sure this is all a timing issue, but I'm just not totally sure the best way to tackle it, since there's no such thing as a 'variable population listener'.

Another thought I've had (but have not tested yet) is to split this out into 2 scripts --- the script that inserts the script at top of body, and then another script that inserts the logic checks at the bottom of <body>. I don't think that'll work any better than the 1000ms setTimeout though.

Triggering JS code when a Data Layer variable gets populated?

Moderator
Moderator

Don't feel sorry @nickmv. We're just trying to shower you with our helpfulness LOVE!!! #HoorayForTealiumExperts

 

@per_lundqvist, @leejon, and @Srinivasan are my HEROES!!!! #lovelovelove

If you liked it then you should have put a kudo on it!

Triggering JS code when a Data Layer variable gets populated?

Employee Emeritus

Agreed @tamedbeast and thank you for the further context @nickmv.

Remember to give me a kudo if you like my post! Accepting my post as a solution is even better! Also remember that search is your friend.

Triggering JS code when a Data Layer variable gets populated?

Tealium Employee

@nickmv

 

At this point, I would raise a support case and get an engineer to look at this for you.

If in the request you can point to the page that would be extremely useful.

 

https://community.tealiumiq.com/t5/custom/page/page-id/support-contact-form

 

Adrian

Ask me anything Tealium related or TypeScript/JavaScript, or NodeJS.
Please remember to mark solutions as accepted for future searchers.
Public