0

jquery code stops working after ajax page load.

Initially, when the page loads, 20 products are loaded and this script works, but after switching to another page with products that is loaded with ajax, this code stops working

(function($){
    $(document).ready(function(){
        $(".variable-item.image-variable-item").on("click", function(){
            if($(this).parents('.jet-woo-product-button').length){
                let btn = $(this).parents('.jet-woo-product-button').find('.add_to_cart_button');
                if(btn.length){
                    btn.click();
                    btn.click(function(){
                        btn.data('clicked', true);
                    });
                    setTimeout(function(){
                        if(btn.data('clicked') != true){
                            btn.click();
                        }
                        btn.data('clicked', false);
                    }, 500);
                }
            } else if($(this).parents('.variations_form').find('.single_add_to_cart_button').length){
                let btn = $(this).parents('.variations_form').find('.single_add_to_cart_button');
                if(btn.length){
                    setTimeout(function(){
                        btn.click(); 
                    }, 500);
                }
            }
        });
    });
})



(jQuery);
Vlad
  • 1
  • 1
    "Stops working" in what way, exactly? Is there an error? An unexpected result? When you debug, what specifically happens? Where in this code is your AJAX request? In what way does it modify the page? – David Aug 18 '21 at 13:17
  • This code adds the item to the cart. Ajax is used to update the store page. There are no errors in the console – Vlad Aug 18 '21 at 13:25

0 Answers0