APIs & Integrations

Mrafey
Contributor

Creating custom behavioural event for button click

SOLVE

Hello! 

I am trying to create a CBE for a button on our prefernces page. Essentially the CBE is created for the "Resubscribe" button. 

The issue I am facing is my CBE not being able to store the button click. When the button is clicked it loads up a thank you page not giving enough time for the _hsq.push method to push the data onto HS.

 

This is what I have so far for the CBE:

 

 

  const resubPrefBtn = document.getElementById('globalresub2');

  if (resubPrefBtn) {
    resubPrefBtn.addEventListener('click', () => {
      console.log('clicked...');
      _hsq.push([
        'trackCustomBehavioralEvent',
        {
          name: 'pe20052921_resubscribe_email_preferences_button_click',
          properties: {
            // give each property a value so we know what they mean
          },
        },
      ]);
    });
  }

 

 


What can I do to ensure that the execution of the CBE happens before the thank you page is shown?

Thank you!

 

0 Upvotes
1 Accepted solution
MrJustinGivens
Solution
Top Contributor | Platinum Partner
Top Contributor | Platinum Partner

Creating custom behavioural event for button click

SOLVE

Then you just need to trigger the .submit() event for the form.

View solution in original post

0 Upvotes
6 Replies 6
MrJustinGivens
Top Contributor | Platinum Partner
Top Contributor | Platinum Partner

Creating custom behavioural event for button click

SOLVE

@Mrafey,

 

You would need to use the preventDefault to "block"  the event from completing, then continue it after the hsq push. 

See the preventDefault MDN.

0 Upvotes
Mrafey
Contributor

Creating custom behavioural event for button click

SOLVE

Hello @MrJustinGivens !

How can I continue after the hsq push function is executed? 

0 Upvotes
MrJustinGivens
Top Contributor | Platinum Partner
Top Contributor | Platinum Partner

Creating custom behavioural event for button click

SOLVE

Depend on the button.

 

If the button has an href attribute then grab the event.target.href and then use window.location = event.target.href;

0 Upvotes
Mrafey
Contributor

Creating custom behavioural event for button click

SOLVE

Unfortunetly it does not have an href attribute. It actually is a input type of "submit" 

Screen Shot 2024-10-03 at 5.13.02 PM.png

0 Upvotes
MrJustinGivens
Solution
Top Contributor | Platinum Partner
Top Contributor | Platinum Partner

Creating custom behavioural event for button click

SOLVE

Then you just need to trigger the .submit() event for the form.

0 Upvotes
Mrafey
Contributor

Creating custom behavioural event for button click

SOLVE

Hello @MrJustinGivens 

I figured out that essentially you cannot create CBE's for preference pages. The HS team told me those pages dont support it.

0 Upvotes