0% found this document useful (0 votes)
6 views

Gecko GTMScript ECMA5 Updated

Uploaded by

Venkey Dematti
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
6 views

Gecko GTMScript ECMA5 Updated

Uploaded by

Venkey Dematti
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

// Code to handle input type text and tel

var inputs = document.querySelectorAll("input");


if (inputs.length > 0) {
Array.prototype.forEach.call(inputs, function (input) {
input.addEventListener("keyup", function (v) {
var elementType, placeHolder, fieldId , autoComplete, type;
autoComplete = input.getAttribute("autocomplete");
type = input.getAttribute("type");

if ((type === "text" || type === "tel") && event.target.value.length >= 2


&& !input.getAttribute("data-triggered")) {
fieldId = input.id;
if (input.getAttribute("role") == 'searchbox') {
elementType = 'select';
fieldId = input.getAttribute("aria-labelledby");
placeHolder = document.getElementById(fieldId).textContent.trim();
}

if(autoComplete === "email") {


elementType = "text";
placeHolder = "Email Address";
} else if(autoComplete === "tel") {
elementType = "tel";
placeHolder = "Telephone Number";
} else {
placeHolder = input.getAttribute("placeholder");
}
window.triggerGtmEvent('gecko-blur-on-input', {
field_id: fieldId,
field_placeholder: placeHolder,
field_type: elementType || type
});
input.setAttribute("data-triggered", true);
}
});
});
}
// Code to handle radio inputs
var radios = document.querySelectorAll("input[type='radio']");
if (radios.length > 0) {
Array.prototype.forEach.call(radios, function (radio) {
radio.addEventListener("change", function () {
var eleName, eleType, eleLabel, elePlaceholder;
if (!radio.getAttribute("data-triggered")) {
eleType = "radio";
eleName = radio.getAttribute("name");
eleLabel = document.querySelector('label[for="' + eleName + '"]');
var getAllRadios = document.querySelectorAll('input[name="' + eleName +
'"]');
if (getAllRadios.length > 0) {
Array.prototype.forEach.call(getAllRadios, function (getAllRadios) {
getAllRadios.setAttribute("data-triggered", true);
});
}
elePlaceholder = eleLabel ? eleLabel.textContent.trim() : "";
window.triggerGtmEvent('gecko-blur-on-input', {
field_id: eleType,
field_placeholder: elePlaceholder,
field_type: eleType
});
radio.setAttribute("data-triggered", true); //Mark the radio as triggred
}
});
});
}
// Code to handle select element
var chosenContainers = document.querySelectorAll(".chosen-container");
if (chosenContainers) {
Array.prototype.forEach.call(chosenContainers, function (select) {
//Store inital span content
var initialContent = select.querySelector('.chosen-single span').textContent;
select.addEventListener("click", function () {
if (!select.dataset.gtmTriggered) {
var spanContent = select.querySelector('.chosen-single span').textContent;
if (spanContent !== initialContent) {
var clickedId = select.id;
// Remove "_container"
var originalId = clickedId.replace("_container", "");
// Find the label value, using for attribute
var fieldLabelElement = document.querySelector('label[for="' + originalId
+ '"]');
// Check if the label element exists before accessing innerHTML
var fieldLabel = fieldLabelElement ? fieldLabelElement.textContent.trim()
: "";
var selectId = originalId;
var selectName = fieldLabel;
var selectType = "select";
// Trigger GTM event
window.triggerGtmEvent('gecko-blur-on-input', {
field_id: originalId,
field_placeholder: fieldLabel,
field_type: selectType
});
select.dataset.gtmTriggered = true;
initialContent = spanContent; //To treating it as the new "initial"
content for future comparisons.
}
}
});
});
}

You might also like