CODEWITHSUNDEEP
google-tag-manager
Obromios
Obromios

Reputation: 16373

How to trigger google tag manager when button is in form but does not cause submission

Using Stripe's checkout.js, I have a button, button.stripe-button-el which I want to monitor. The button is within a form, but does not cause form submission. Using Google Tag Manager,

Form Classes matches CSS selector stripe-button-el

does not work, presumably because clicking the button does not submit the form. What filter should I use to monitor clicks of this button?

The html for the button is

  <button type="submit" class="stripe-button-el" style="visibility: visible;">
     <span style="display: block; min-height: 30px;">Pay with Card</span>
  </button>

If I use tag preview mode, when I click the button, then what appears to be triggered is

Click Element   Data Layer Variable object [object HTMLSpanElement]

so it appears that the span within the button is what I should be triggering on, but it does not have a class but does have text, 'Pay with Card'.

Upvotes: 0

Views: 585

Answers (1)

Michele Pisani
Michele Pisani

Reputation: 14179

Did you try with 'Click - All Element' specifying the class of the clicked item? You can check in the Google Tag Manager preview which class is actually detected when the item is clicked. And you can use that.

In the extreme case you can use a trigger 'Click - All Element' then fires on {{Click Text}} equals 'YOUR TEXT'. If {{Click Text}} is not present in the variables you can choose you must activate it from the built-in variables in Variables.

Upvotes: 1

Related Questions