using woocommerce_template_single_add_to_cart in shop-loop – javascript issues [closed]

We want to show product variations on all product tiles, in all views. I have some code using woocommerce hooks added to functions.php (see below) that does the trick visually but we have several pages that are loaded through the infinite scroll functionality and products delivered through this method are not being initialised with the required javaScript to view/select the required options.

// SHOW PRODUCT VARIATIONS
add_action( 'woocommerce_after_shop_loop_item', 
  'pn_show_single_add_to_cart', 0);

function pn_show_single_add_to_cart(){
   global $product;
   if( !$product->is_in_stock()){
       add_action( 'woocommerce_after_shop_loop_item', 
         'woocommerce_template_single_add_to_cart', 30 );
} else {
    remove_action( 'woocommerce_after_shop_loop_item', 
        'woocommerce_template_loop_add_to_cart');
    add_action( 'woocommerce_after_shop_loop_item', 
        'woocommerce_template_single_add_to_cart', 30 );
}

};

I suspect the issue is related to bypassing the “select options” button click that normally loads this content through ajax and displays it in a overlay but i have no idea how to attach this binding to the woocommerce hook.

I have read through endless posts that come close but none that use hooks,the two below almost certainly point in the correct direction but the both seem to focus on making custom templates:
https://stackoverflow.com/questions/34268800/variations-javascript-not-working-when-single-product-content-is-loaded-via-ajax
and
https://stackoverflow.com/questions/48328797/reinitialise-woocommerce-scripts-again-after-loading-products-with-wordpress-inf

0

Leave a Comment