I am having trouble tracking the value of the "option" tag in the "select" tag. I currently have a drop down menu for Google Translator Widget where user can click on it and select the language. When you click on the "Select Language" drop down, you will be able to see German as the option. See the attached screenshots. I have created a Macro call "JS - Google Translate - Select Option" in the Google Tag Manager.
Here is the code for "JS - Google Translate - Select Option":
function() {
var list = document.querySelector('select.goog-te-combo');
return list ? list.options[list.selectedIndex].value : undefined;
}
Above code, will find the drop down menu, which has "goog-te-combo" as a class name for "select" tag. Then, it will see if the option tags are available in the select tag and get the value of the selected option tag.
I also have created a tag call "GA - Event - Google Translate Clicks" and trigger call "Click - Google Translate".
When I test this out, I see that my "GA - Event - Google Translate Clicks" get triggered when I click on the drop down menu on my page. However, when I check the "variables" tab in the Google Tag Manager and check the variable "JS - Google Translate - Select Option", I see it empty.
Google Translator Widget Drop down menu option
Google Tag Manager "JS - Google Translate - Select Option" empty
