Javascript DataLayer Fetch from - javascript

I'd like to pull data from my HTML code into my dataLayer (Google Tag Manager).
The html code is something like this:
<body class="portal sessions" data-place="hun">...</body>
And the Javascript Code is something like this:
<script type="text/javascript">
var lang_log = document.getElementsByClassName("portal");
dataLayer.push({
"language_login":lang_log
})
</script>
What I'd try is to give to the lang_log variable the "hun" value and I'd try:
<script type="text/javascript">
var lang_log = document.getElementsByClassName("portal")['data-place'];
dataLayer.push({
"language_login":lang_log
})
</script>
But it's not working.
Any ideas?
Any help or advice is apprecaited, Thank you in advance.

document.getElementsByClassName("portal") returns an array-like collection of elements.
You can get the first element of this collection with document.getElementsByClassName("portal")[0].
To access the data attribute, use document.getElementsByClassName("portal")[0].dataset.place.
var AdataLayer = [];
var lang_log = document.getElementsByClassName("portal")[0].dataset.place;
AdataLayer.push({
"language_login":lang_log
})
console.log(AdataLayer);
console.log(AdataLayer[0].language_login);
<body class="portal sessions" id="portal" data-place="hun">...</body>

Found the solution:
the JS should be:
<script type="text/javascript">
var lang_log = document.getElementsByTagName("body")[0].getAttribute("data-locale");
dataLayer.push({
"language_login":lang_log
})
</script>
Still investigating in why the first version did not work!

Related

Is there a way to verify using liquid, if script tag is duplicated?

I would like to check using liquid language, if is there somewhere in the page, a script being called twice or more.
For example:
<script src="myscripts.js"></script>
<script src="myscripts.js"></script>
Is it possible using liquid or should I use javascript to validate?
I'm not sure about liquid, but if you wanted to go the JS route, this could work:
//locate all `<script>` tags and save the elements into an array
var scriptTags = [];
document.querySelectorAll('script').forEach(function(tag) {
scriptTags.push(tag)
});
//Put just the URLs of the script tags into an array
var scriptUrls = scriptTags.map(function(tag) {
return tag.src;
});
//Get a list of any URL that appears more than once
var duplicateUrls = scriptUrls.filter(function(url, i) {
return scriptUrls.indexOf(url) != i;
});
console.log(duplicateUrls);
<script src="dupe.js"></script>
<script src="other1.js"></script>
<script src="dupe.js"></script>
<script src="other2.js"></script>
<script src="other3.js"></script>

correctly write in javascript a value received from a bean

I need to pass a value from a bean into a JavaScript part of a HTML page
<script language="javascript" for="obj" event="ControlInitialized>
obj.URL = #{myBean.ObjectURL};
</script>
where #{myBean.ObjectURL} is :
http://localhost:8080/project/descript.xsd
Always, always look at the generated output.
obj.URL = http://localhost:8080/project/descript.xsd;
Notice anything missing?
obj.URL = "http://localhost:8080/project/descript.xsd";
It must be a string:
<script language="javascript" ">
objURL = "#{myBean.ObjectURL}";
</script>
Try this:
<script language="javascript" > //Remove the extra quote
obj.URL = "#{myBean.ObjectURL}"; // Put it in quotes
</script>

Parse xml tag attributes using Javascript or Jquery?

I have one xml. Example XML is given below
<company sample="text">
<employee id="001" sex="M" age="20">Premshree Pillai</employee>
</company>
I need to get company attribute sample value
I am trying this method
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript">
window.onload = function() {
var currLoanXml = '<company sample="text"><employee id="001" sex="M" age="20">Premshree Pillai</employee></company>';
var pic = $(currLoanXml).find('company').attr('sample');
alert(pic);
};
</script>
Its Shows Undefined in my alert box.
But i can also alert this child tag its working
var pic = $(currLoanXml).find('employee').attr('id');
alert(pic);
What is a problem. I need to get first tag attributes. Please help me.
you need to use filter() instead of find() here because company is the root element, ie currLoanXml refers to the company element. find will look for decedent elements only
var currLoanXml = '<company sample="text"><employee id="001" sex="M" age="20">Premshree Pillai</employee></company>';
var pic = $(currLoanXml).filter('company').attr('sample');
alert(pic);
Demo: Fiddle
You go too deep
$(function() {
var currLoanXml = '<company sample="text"><employee id="001" sex="M" age="20">Premshree Pillai</employee></company>';
var sample = $(currLoanXml).attr('sample');
console.log(sample);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

function not working to convert html

I am wondering if someone can spot the mistake in my code?
javascript:
function decodehtml(thestring){
var decoded = $("<div/>").html(thestring).text();
alert(decoded);
return decoded;
}
inside html:
<script type="text/javascript">
decodehtml("test string");
</script>
I know it is both returning and alerting, the alert is in there just for the test. For some reason this is doing nothing.
Any ideas?
Simon
Edit:
Even placing this directly into the html does not work:
<script type="text/javascript">
var decoded = $("<div/>").html("test string").text();
alert(decoded);
</script>
function decodehtml(thestring) {
var decoded = $("<div/>").html(thestring).text();
alert(decoded);
return decoded;
}
decodehtml("stuff");
Seems to work fine. Here's the jsFiddle
$ is not defined
This means you are not including jQuery. Place this in your head tag :
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
And then put your code.

How to get id of javascript's container?

I would like to get ID of javascript's container, for ex:
<div id="d_17j_a">
<script type="text/javascript">
alert("<ID of javascript's container here>");
// it will alert: d_17j_a
</script>
</div>
(ID of div is dynamic)
Thank for any suggestion !
So scripts are loaded sequentially, so you can get the parent node of a script element through:
var scripts = document.getElementsByTagName('script');
var me = scripts[scripts.length-1];
console.log('parent id', me.parentNode.id);
<script id="FindMe" type="text/javasctipt"> should work just fine using jQuery("#FindMe").parent().id
In pure javascript
document.getElementById("FindMe").parentNode.id
If you can add an id to your script tag you can grab the parent with Javascript after retrieving the script element.
<div id="d_17j_a">
<script id="myScript" type="text/javascript">
var parentId = document.getElementById("myScript").parentNode.id;
alert(parentId);
// it will alert: d_17j_a
</script>
</div>

Categories