Expand my Community achievements bar.

SOLVED

Issue in pushing values into dataLayer object

Avatar

Level 4

I'm are working on the dataLayer for our project and I'm pushing title, url, section, subsection, subsubsection & subsubsubsection from the request URL.

Please find the below sample url and split of different sections in the URL.

URL.png

 

 

 

 

 

Please find the below code snippet from dataLayer.html

I want to push data only when it is available. For instance, if I don't have subsubsection in my URL, I don't wish to see even empty subsubsection(subsubsection:"") inside the dataLayer object.

 

<script language="JavaScript" type="text/javascript">
window.dataLayer = window.dataLayer || [];
var urlWithoutExt = window.location.href.replace(location.search, '').replace(/\.[^/.]+$/, "");
console.log("urlWithoutExt::::"+urlWithoutExt);

var tempsubsection = "";
var tempsubsubsection = "";
var tempsubsubsubsection = "";

if(urlWithoutExt.toString().split("/")[3] != null){
	tempsubsection = urlWithoutExt.toString().split("/")[3];
} 
if(urlWithoutExt.toString().split("/")[4] != null){
    tempsubsubsection = urlWithoutExt.toString().split("/")[4];
} 
if(urlWithoutExt.toString().split("/")[5] != null){
	tempsubsubsubsection = urlWithoutExt.toString().split("/")[5];
} 

window.dataLayer.push({
event: 'content_landing',
eventInfo: {
	title: '${currentPage.title || currentPage.name @ context="text"}',
        url: window.location.href.replace(location.search, ''),
	section: window.location.hostname,
        subsection: tempsubsection,
        subsubsection: tempsubsubsection,
        subsubsubsection: tempsubsubsubsection
  }
});
</script>

 

 

Please find the below browser console - From the dataLayer object, there is n't any subsubsection or subsubsubsection and we are seeing empty values for the both. (Actual Result)

 

I expect both subsubsection subsubsubsection should not available inside the dataLayer object itself. (Expected Result)

datalayer.jpg

Kindly help me on this problem.

Thank you.

 

Regards,

SHYAMSUNDAR TK

Topics

Topics help categorize Community content and increase your ability to discover relevant content.

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi @samsundar23 

Here the key are added by you on code and it will have empty value if the variable does not contain any value. So definitely you are going to get empty value with respect to key on the dataLayer object.

 

If you do not want to get the key when the respective value is empty, I will suggest that you should go for a sling model and perform all the logical operation i.e. reading of title, section and subsection on the backend and send the value in a list to HTL. On the HTL, you can iterate over the list and push the value which will ensure to push only the key and value when both the items are present. Also you can keep it something like 

subsectionL1
subsectionL2
subsectionL3

 

To make it dynamic you can read the count and append it with the String as "subsectionL" + ${itemList.count}.

 

Thanks! 

View solution in original post

5 Replies

Avatar

Correct answer by
Community Advisor

Hi @samsundar23 

Here the key are added by you on code and it will have empty value if the variable does not contain any value. So definitely you are going to get empty value with respect to key on the dataLayer object.

 

If you do not want to get the key when the respective value is empty, I will suggest that you should go for a sling model and perform all the logical operation i.e. reading of title, section and subsection on the backend and send the value in a list to HTL. On the HTL, you can iterate over the list and push the value which will ensure to push only the key and value when both the items are present. Also you can keep it something like 

subsectionL1
subsectionL2
subsectionL3

 

To make it dynamic you can read the count and append it with the String as "subsectionL" + ${itemList.count}.

 

Thanks! 

Avatar

Community Advisor

Hi @samsundar23,

 

For this, you can create a temp variable that stores all the data. While adding the temp to the main object, perform a null check.

 

Hope this helps.

 

Thanks,

Kiran Vedantam

Avatar

Community Advisor

Hi @samsundar23,

 

You can create a temp variable like this in the area that you need and assign it to the main variable

 

Object.assign(abcd, abcdTemp);

 

Generally, the temp variable would get the value from the component or from the page assignment and later we use the above snippet to re-assign. Before reassigning, perform a null check as per your requirement.

 

Hope this helps.

 

Thanks,

Kiran Vedantam.

Avatar

Community Advisor

@samsundar23 

In the example you shared the request url is https://dev.ms.net/homepahe.html, you don't have sub or sub-sub levels.

Do undefined check not null check and see once.

Example:

if(urlWithoutExt.toString().split("/")[4] != undefined){
    tempsubsubsection = urlWithoutExt.toString().split("/")[4];
}