Creating custom behavioural event for button click

Develop, Build & Integrate APIs & Integrations
,
1

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!

2

@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.

3

Hello @MrJustinGivens !
How can I continue after the hsq push function is executed?

4

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;

5

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

6

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

7

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.