How to get the value of a clicked element and send it to an Adobe Analytics eVar?

brandon_flynn
Rookie Contributor
brandon_flynn

Goal:

When a user clicks the button, set eVar2 to the innerHTML of the button.

Example:

<button class="mybtn">foo</button>

<button class="mybtn">bar</button>

When the user clicks a button, set eVar2 to 'foo' or 'bar'.

Discussion:

  • Should I be using Tealium to do this / is this best practice?
  • Is there a custom JavaScript option available?
  • If so, could I identify the clicked element in that custom code?
3 REPLIES 3

How to get the value of a clicked element and send it to an Adobe Analytics eVar?

Tealium Expert
Tealium Expert

Hi @brandon_flynn

This easiest way to do this is probably:

- add an event handler extension. 

- Set the selector to .mybtn and the trigger to click

- Assign a JS Code to the data object you have that is mapped to evar2, and use jQuery to read the text out of the button.  Something like $(this).text() should read the inner text from the element that was clicked (if you don't have jquery on the site you can do it using "normal" javascript)

It will look a bit like this:

2018-08-20_16-13-01.jpg

 

Hope that helps

How to get the value of a clicked element and send it to an Adobe Analytics eVar?

brandon_flynn
Rookie Contributor
brandon_flynn
Perfect. Thank you, Ben.

How to get the value of a clicked element and send it to an Adobe Analytics eVar?

rajdeep91
Rookie Contributor
rajdeep91

What if I have to get the values from a Data layer which is getting populated on the click of link or button.

For e.g. 

<a id="link1" onclick="Link1DataLayer()" href="http://www.google.co.in">Basic Link Tracking</a></h1>
<script>
function Link1DataLayer()
{
var Link_Data = {
linkName : $("a#link1").text(),
linkUrl : $("a#link1").attr('href')
}
}
</script>

What's happening here is, on the click of link, a data layer is getting populated and now I want to grab the values from the data layer instead of DOM scrapping.