Product quantity selector on product page

/**
 * @snippet       Calculate Subtotal Based on Quantity - WooCommerce Single Product
 * @how-to        Get CustomizeWoo.com FREE
 * @author        Rodolfo Melogli
 * @compatible    WooCommerce 4.1
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */
 
function action_woocommerce_after_add_to_cart_button() {
    global $product;
    
    echo '<div id="subtot" style="display:inline-block;"><span></span></div>';
    
    $price = $product->get_price();
    $currency = get_woocommerce_currency_symbol();
    
    wc_enqueue_js( "      
        $( '[name=quantity]' ).on( 'input change', function() {
            var qty = $( this ).val();
            var price = '" . esc_js( $price ) . "';
            var price_string = ( price*qty ).toFixed(2);
            
            // Greater than
            if ( qty > 1 ) {
                $( '#subtot > span').html( 'Total: " . esc_js( $currency ) . "' + price_string );
            } else {
                $( '#subtot > span').html( '' );                
            }
        }).change();
    " );
}
add_action( 'woocommerce_after_add_to_cart_button', 'action_woocommerce_after_add_to_cart_button', 10, 0 );

Hi @sabahath ,

Thanks for reaching out!

I understand that the custom code you provided works as expected for simple products, however, is not working for variable products, is this correct?

From what I gathered, the code’s purpose is to add a function for calculating the total cost per product, as the quantity selector is either increased or decreased.

Here are my results after testing this code on my staging site:

Simple Product:

Variable Product:

If you are not seeing the same results on your end, it may be that another plugin or other custom code on your site is conflicting with this, which in turn, is causing an issue with the custom codes outcome, specifically with variable products.

I’d suggest performing a full conflict test to rule this out.

To test, you’ll want to temporarily disable any other custom code added to your site, while only leaving this code in tact, deactivate all plugins except for WooCommerce , and take a look. If that fixes the problem, re-enable the other plugins , and custom code, one by one (gradually), checking after each, to see where the issue is coming from.

If you don’t want to test on your live site, then create a staging site using a plugin called WP Staging.

Hope this helps!

Dear Roxy,

Thanks for the reply but unfortunatly nothing is working – I have checked removing all other codes and deactivated all plugins except woocommerce as suggested but still the above code is taking prices from the first variable product and considering variable product as single product.

I doubt this following line in code should be amended, it needs your expert attention please suggest

@snippet Calculate Subtotal Based on Quantity – WooCommerce Single Product

Thanks a lot

Hi @sabahath

Kindly be informed that custom coding is outside our scope of support, hence, I am leaving this thread open for a bit to see if anyone can chime in to help you out.

For questions related to development and custom coding, your best bet is to ask on any of these channels for support. We’re lucky to have a great community of open-source developers for WooCommerce, and many of our developers hang out there, too.

• WooCommerce Developer Resources Portal
• WooCommerce Advanced Facebook group
• WooCommerce Community Forum
• WooCommerce Developer Slack Channel
• Hire a WooCommerce Expert

Hope this helps!