Dynamic Tag Manager PushState rule | Community
Skip to main content
Level 2
December 14, 2015
Solved

Dynamic Tag Manager PushState rule

  • December 14, 2015
  • 1 reply
  • 1665 views

The pushState/hashchange event type available under rule conditions is incredibly useful for ajax based web sites and I am successfully using it when URLs change and new content is loaded without an actual page load happening. However, I would like to take this a step further but am not sure how. I am wondering if it is possible to configure a rule so that rather than triggering analytics code immediately after a pushState or hashchange, instead the rule waits for the content or DOM to load so I can make use of variables, elements, etc. on the page. My currently rule works fine for capturing the basic new URL that was requested but I can't make use of any data on the page itself because of how early the analytics code fires.

Any suggestions?

Thank you!

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by ParitMittal

Hi Al Dugan,

As per the scenario discussed above, you need to select "Custom" option in Rule Condition and enter the following code in  Custom Code box :

if(document.readyState === "complete") {
 return true;
}
else {
document.addEventListener("DOMContentLoaded", function () {return true;}, false);
}

We have basically used the document.readyState property to check if the document is ready or not i.e. DOM content is loaded or not.

Also, Please refer the attached snapshot for more help and please do let us know in case of any questions or queries.

Thanks & Regards

Parit Mittal

1 reply

ParitMittal
ParitMittalAccepted solution
Level 10
December 18, 2015

Hi Al Dugan,

As per the scenario discussed above, you need to select "Custom" option in Rule Condition and enter the following code in  Custom Code box :

if(document.readyState === "complete") {
 return true;
}
else {
document.addEventListener("DOMContentLoaded", function () {return true;}, false);
}

We have basically used the document.readyState property to check if the document is ready or not i.e. DOM content is loaded or not.

Also, Please refer the attached snapshot for more help and please do let us know in case of any questions or queries.

Thanks & Regards

Parit Mittal