Where on that page can I find the HTML form?
Thanks for letting me know.
The red button in header.
But you can easily see the error in conslole > navigate to error.
Or search (ctrl/cmd+f) in code…
Maybe HTML forms script isn’t loaded yet at the time you execute that JS code.
Can you add
document.addEventListener("DOMContentLoaded", function(event) {
//code goes here
});
and see if that solves the issue for you?
Hope that helps. If you have any questions, please let me know!
I have tried many conditions (your solution as well) and I am loading it after everything was fully loaded. And I still get same error:
TypeError: document.querySelector('.hf-form-356').on is not a function. (In 'document.querySelector('.hf-form-356').on('hf-submit', function(e) {
console.log('sent');
window.dataLayer.push({
'event': 'FormSent'
});
})', 'document.querySelector('.hf-form-356').on' is undefined)
I have run out of solutions… 🙁
I finally found something. It is working in jquery not in javascript…
When I wrap it in jquery, it is working. I think, it is because “document.querySelector” will select specific form, but you can work with it as an object.
Here is working code – in default WP jQuery v1.12.4 with anonym wrapper function
<script>
(function ($) {
$(window).ready(function () {
$('.hf-form-356').on('hf-submit', function(e) {
console.log('email-send');
window.dataLayer.push({
'event': 'FormSent'
});
});
});
}(jQuery));
</script>
Have a nice day,
Jakub
Awesome, Thanks for letting me know.