Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

Click events in Launch using div id

Jmaguire
Level 2
Level 2

Hi,

 

I'm looking to tracking click interaction with elements on my homepage using CSS selectors.

 

I can see the option for a rule in Launch based on click but unsure what syntax to specify under "Elements matching the CSS selector".

 

The selector I'll be looking for interaction on is <div id="addButton"> or <div id="minusButton">.

 

Thanks,

James

1 Accepted Solution
Brian_Johnson_
Correct answer by
Community Advisor
Community Advisor

@Jmaguire -

It's just looking for a basic selector, the same you would use with document.querySelector() or document.querySelectorAll(). For the two DIVs in your question, since they have unique IDs (at least, the IDs should be unique on the page), you can use #addButton and #minusButton, respectively.

 

More on selectors here.

View solution in original post

10 Replies
Brian_Johnson_
Correct answer by
Community Advisor
Community Advisor

@Jmaguire -

It's just looking for a basic selector, the same you would use with document.querySelector() or document.querySelectorAll(). For the two DIVs in your question, since they have unique IDs (at least, the IDs should be unique on the page), you can use #addButton and #minusButton, respectively.

 

More on selectors here.

View solution in original post

Jmaguire
Level 2
Level 2

Thanks @Brian_Johnson_, managed to get to work.
How would I go about passing the name of 'Add' or 'Subtract' to Analytics, ie. Add used, to the custom link report?

yuhuisg
Community Advisor
Community Advisor
@Jmaguire assuming the "Add" / "Subtract" text are the text inside the <div> elements, then in your Action, you can use %this.@text% to get that text from your clicked element.
Jmaguire
Level 2
Level 2

@yuhuisgmany thanks for your reply. Where would I specify %this.@text%? I tried putting it in Custom Link - Link Name for the beacon I'm sending.

Jmaguire_0-1615390380378.png

 

yuhuisg
Community Advisor
Community Advisor
@Jmaguire yes, that is the correct place. Is it not sending the text within your clicked element?
Jmaguire
Level 2
Level 2
@yuhuisg It gives me a blank value. I tried with a text string as a test and it worked fine, but %this.@text% shows as blank link name
Jmaguire
Level 2
Level 2

I should mention there is no text for Add and Subtract, they are images.

Is there a way to pull the value xyz from <div id="xyz"> ?

Brian_Johnson_
Community Advisor
Community Advisor
The lack of text is definitely your issue, then. Try using %this.id% instead. Also, I find the Launch Cheat Sheet handy to have around... https://jimalytics.com/wp-content/uploads/2017/11/Adobe-Launch-Cheat-Sheet.pdf
Jmaguire
Level 2
Level 2
Many thanks @Brian_Johnson_, that worked perfectly. Also, thanks for the cheat sheet, will definitely come in use. Thank you both.