A jQuery function needs to initialize after shipping options have been updated, on the checkout page, through an ajax call, and the Woocommerce custom event updated_shipping_method has been triggered.
My jQuery snippet is set-up to listen to this event - but this is not functioning as intended.
jQuery( document.body ).on( 'updated_shipping_method', function(){
// Code stuffs
// has the function initialized after the event trigger?
console.log('on updated_shipping_method: function fired');
});
I've tried the updated_wc_div custom event as well to no avail.
I'm using a similar method, almost verbatim, on the cart page to listen to the custom event trigger for updated_cart_totals and it works perfectly. Not sure why this isn't the case for the checkout page.
Correct Custom Event: updated_checkout
The code snippet in question was listening to the incorrect Woocommerce custom event.
The correct custom event to listen to in this case is updated_checkout.
When selecting a new shipping method, Woocommerce fires an ajax call to update the cart totals to reflect the price of the shipping method selected, then triggers updated_checkout.
So if updated_checkout is listened to, rather than updated_shipping_method, the script is fired as intended.