Archived topic
Implement event listener on Woocommerce Cart icon in secondary menu
5 replies · Started by moderndev on July 5, 2020
Hello,
I am not especially good with Javascript and I am having a little trouble trying to implement a floating cart trigger solution.
Basically the developer has given a function that toggles the cart and I am trying to use an event listener to implement it when the woocommerce cart button is clicked.
xt_woofc_toggle_cart()
Ive added the following element in the backend, but it wont seem to trigger the cart.
<script>
document.getElementClassName("shopping-bag").addEventListener("click", floatCart);
function floatCart() {
xt_woofc_toggle_cart();
}
</script>
If I run it in the console it does seem to work. Any tips?
Best,
Peter
Hi there,
try:
<script>
document.getElementsByClassName('shopping-bag')[0].addEventListener('click', floatCart );
function floatCart() {
xt_woofc_toggle_cart();
}
</script>Hey David,
that through an error
?purge_success=1&cache_type=all:337 Uncaught TypeError: Cannot read property 'addEventListener' of undefined
at ?purge_success=1&cache_type=all:337
You could try this:
<script>
var menuItems = document.querySelectorAll( '.shopping-bag' );
var i;
for ( i = 0; i < menuItems.length; i += 1 ) {
links[ i ].addEventListener( 'click', function( e ) {
floatCart();
}, false );
}
function floatCart() {
xt_woofc_toggle_cart();
}
</script>Hey Tom,
Thanks for your help. That didnt work. I have written to the plugin developer to see if they have any more tips.
I will try and follow up here.
Best,
moderndev
Sounds good - let us know :)
