We are developing plugin which integrates services like Google Ads, Google Analytics, Google Tag Manager etc…

These services contains “frontend actions” which are triggered on “product removal from cart, coupon added etc.”

In latest versions woocomerce is shipped with Gutenberg blocks as default.

Are there any js events which we can catch to integrate this or is there any different approach how to work with them?

I tried to search the documentation but the 3rd part event sections shows 404

like: https://github.com/woocommerce/woocommerce/blob/trunk/plugins/woocommerce-blocks/docs/third-party-developers/extensibility/checkout-block/dom-events.md

Thanks for any advice

function redirectionFormulaire() {
console.log(“YESSSSSSSSSSSSS”);
}
add_action( ‘wpcf7_submit’, ‘redirectionFormulaire’ );

<script>
document.addEventListener( ‘wpcf7mailsent’, function( event ) {
location = ‘/thankyoupage’;
}, false );
</script>

and redirection runs only with the contact form in contact page. I dont know why!!

Than I replaced the previous code with the following

<script>
document.addEventListener( ‘wpcf7mailsent’, function( event ) {
if ( ‘123’ == event.detail.contactFormId ) {
location = ‘/thankyoupage’;
}
}, false );
</script>

than the contact form that’s in contact page doesnt run as the second contact form that have 123 as id.

I tried the same in footer.php and nothing is changed.

Could someone please help me?

In the following situation:

Multiple forms (3 in my case) sending to different thank you pages for GA tracking.

How do you tell functions.php to direct the forms to certain thank you pages?

Thanks

For example:

If they select 1 in the dropdown then they go to the URL containing /1
If they select 2 in the dropdown then they go to the URL containing /2
If they select 3 in the dropdown then they go to the URL containing /3

I have been researching and am unable to find a clear answer to solve this problem but it appears to be pointing to using javascript and DOM Events.

However, as I am not experienced in this area I require some help to solve this problem.

I would like to know:

– what code I would need to insert to make this work
– specifically where this code should be placed within wordpress
– If it isn’t possible, any alternatives to solve this issue

Many thanks for your help!

As of now, I have to write PHP to create a script variable that loops through all the CF7 contact forms and returns on array with CF7ID and CF7 Form name. That’s a little messy.

Before you remove on_sent_ok functionality, would it be possible to add the contact form name or title to the event object that is returned with each dom event, the same way we can access the form id (event.detail.contactFormId)?

It might also be helpful if you could also figure out a way to return a redirect url in the same object. Maybe a new additional field called ‘redirect_to’ or something like that.

CF7 is one of the most used contact form solutions and I really want to thank you for all your work over the years. But, as it stands now, I stand to lose event tracking on dozens of client websites unless I whip up a custom PHP solution to get the form name and redirect URL and now have to update all the forms on all my client sites since it seems to indicate that this functionality will stop working in early 2018. Please keep backwards compatibility if you can, at least.

i know the on_sent_ok is being done away with but not sure how to code this using DOM.

Help!!!

add_action( ‘wp_footer’, ‘mycustom_wp_footer’ );

function mycustom_wp_footer() {
?>
<script type=”text/javascript”>
document.addEventListener( ‘wpcf7mailsent’, function( event ) {
if ( ‘123’ == event.detail.contactFormId ) {
location.replace(‘/contact-confirmation’);
}
}, false );
</script>
<?php
}
In this case, the ga() function will be executed only if the ID of the contact form (event.detail.contactFormId) is “123”.

As the additional setting “on_submit: ” is deprecated I’m trying to use DOM events to accomplish this.

I have been trying adding this js:
document.addEventListener( ‘wpcf7submit’, function( event ) {
$(‘input[type=text]’).val(function(){return this.value.toUpperCase();})
}
But unfortunately JS/PHP are not my specialty. And I have found no evidence of anyone tackling the uppercase problem yet.

Could somebody help me?

Thank you so much

thanks for your help!