Problem with the "add to cart" item counter in woocommerce for variable products

Hi,

Thank you for understanding. Would you mind if we take a look at one of the products with the issue? We would like to inspect it.

Best regards,
Ismael

Hi,

Thank you for the update. The account is not an admin so we can’t get in the dashboard. Please edit the config-woocommerce > woocommerce-mod.js file, look for this code around line 48.

newNum.val(the_val).trigger("change");

Replace it with this code..

if(the_val <= max) {
	newNum.val(the_val).trigger("change");
}

Make sure that the line that you will modify is under the “plus” button or this line.

plus.on('click', function(){

Best regards,
Ismael

Hi,

The max attibute is set to “29” while the actual max attribute of the input field is set to the number of available stock. Please try to disable the “swatch” and “stock” extensions temporarily.

Best regards,
Ismael

Hi,

Thanks for the info.

We adjusted the filter and moved it inside the functions.php file.

add_action( 'woocommerce_single_product_summary', 'woocommerce_total_product_price', 25 );
function woocommerce_total_product_price() {
	if(!is_admin()) {
    global $woocommerce, $product;
    // let's setup our divs
    echo sprintf('
<div id="product_total_price" style="font-size: 16px; font-weight: 200;">%s %s</div>
',__('Total Price (incl Tax):','woocommerce'),'<span class="price">'. get_woocommerce_currency_symbol() .' ' .$product->get_price().'</span>');
    ?>
        <script>
            jQuery(function($){
				$(document).ready(function() {
					function setMinMax() {
						var price = <?php echo $product->get_price(); ?>;
						var currency = '<?php echo get_woocommerce_currency_symbol(); ?>';
						var qtycont =  $('.quantity');
						var qty =  qtycont.find('[name=quantity]');
						var max = qty.attr('max');
						var min = qty.attr('min');

						if(typeof max === typeof undefined && max === false) return;

						qty.attr('data-qty', 1);
						
						$('.variations select').on('change', function() {
							qty.attr('data-qty', 1);
							qty.attr('value', 1);
							qty.text(1);
						});

						qtycont.on('click', '.plus, .minus', function(){
							var qtythis = $(this).find('[name=quantity]');
							var qtyNum = $(qtythis.selector).attr('data-qty');	
							var max = $(qtythis.selector).attr('max');
							var min = $(qtythis.selector).attr('min');
							var totalQty = parseInt(qtyNum);

							if($(this).is('.plus') && qtyNum < max) {
								totalQty = parseInt(qtyNum) + 1;
								$(qtythis.selector).attr('data-qty', totalQty);
							} else if($(this).is('.minus') && qtyNum > min) {
								totalQty = parseInt(qtyNum) - 1;
								$(qtythis.selector).attr('data-qty', totalQty);
							}

							$(qtythis.selector).attr('value', totalQty);

							if (!totalQty < 1) {
								var product_total = parseFloat(price * totalQty);
								$('#product_total_price .price').html( currency + product_total);			
							}	
						});
					}	
                
					setTimeout(function() {
						setMinMax();
					}, 300);
					
					$(document).on('updated_cart_totals', setMinMax);	
				});
            });
        </script>
    <?php
	}
}

It limits the quantity based on the stock. Please remove browser cache prior to checking the page.

Best regards,
Ismael

Hi!

I’m not sure if this is going to be included in the theme by default because it’s quite specific to your site or case. Please keep the filter in the child theme’s functions.php file. If you haven’t created a child theme yet, please refer to the documentation.

// https://kriesi.at/documentation/enfold/how-to-install-enfold-theme/#why-child-theme

Regards,
Ismael