Woocommerce variable product add to cart button stays greyed out with many variations

I have run into this a handful of times now so felt the need to document it here.

The Issue:

When you have a variable Woocommerce product with many different variations, you sometimes end up not being able to add the product to the cart. After you select all of the attributes necessary the button just stays greyed out.

This appears to happen because Woocommerce preloads a certain amount of variation results to save on ajax database calls. If the total amount of variations is more than what is preloaded then Woocommerce tries to send ajax calls after you select the last option to check for validity. I am not 100% certain why it doesn’t let you add to cart after this call. You can see the ajax call in the network tab when you inspect the page during the process and it shows a return json with a success status.

The Solution:

Some amazing individuals have discovered a filter for increasing the amount of variations that Woocommerce will load on a single product. It CAN effect page loading speed so you need to take that into consideration. A variable product with 1500 variations is going to be problematic regardless.

Credit goes to this link: https://gist.github.com/claudiosanches/6f91ad228c2176b986b2

add_filter( 'woocommerce_ajax_variation_threshold', 'custom_wc_ajax_variation_threshold', 10, 2 );
function custom_wc_ajax_variation_threshold( $qty, $product ) {
	return 10;
}

add_filter( 'woocommerce_ajax_variation_threshold', 'custom_wc_ajax_variation_threshold', 10, 2 );

function custom_wc_ajax_variation_threshold( $qty, $product ) {

return 10;

}

You can set this to return a higher number to allow a larger variation to load.