Disable -/+ buttons on woocommerce product page for product variations when quantity input is hidden in composite product

Question

I am using woo composite products, and for component product variations, the maximum quantity is set to 1, so the quantity input field is automatically hidden.

However, the - / + buttons are still there! This looks bad. (not an issue for simple products)

This is the html on the page

<div class="quantity buttons_added" style="">
<input type="button" value="-" class="minus">
<input class="qty" type="hidden" name="quantity" value="1" min="1" max="1">
<input type="button" value="+" class="plus"></div>

and i think this might be the relevant code in the plugin

<div class="single_variation"></div>
<div class="variations_button">
<input type="hidden" name="variation_id" value="" />
<?php
if ( $quantity_min == $quantity_max ) {
if ( $quantity_min == 1 ) {
?>

<div class="quantity" style="display:none;">

<input class="qty" type="hidden" name="quantity" value="1" />

</div>
<?php
} else {
?>
<div class="quantity"><input type="number" class="qty input-text text" disabled="disabled" name="quantity" min="<?php echo $quantity_min; ?>" max="<?php echo $quantity_min; ?>" value="<?php echo $quantity_min; ?>" /></div>
<?php
}
} else
// min-max taken care of by variations code
woocommerce_quantity_input( array( 'input_value' => $quantity_min ), $product );
?>

From looking around, I think the solution is to include some custom javascript code, but this is far beyond me. Any help for a Noob would be greatly appreciated.

Answer 1

In your css, adding the following rule should hide the +/- option

.minus, .plus
{
    display:none;
} 

OR to remove the quantity box and the +/- options you can do it by:

• Edit your product
• Scroll to the "Product Data" section
• Click "Inventory"
• Tick the checkbox that says "Sold Individually"

Answer 2

To confirm, setting it to sold individually does do the trick, but if you are using product addons, it has an undesirable side effect of not displaying the the addon totals, etc. The selected addons are included when you add them to your cart though, they just don't display as they normally would on the product page.

A workaround that I found that works is to use CSS that is specific to the composite form. Each composite has a unique ID. So if you are looking to do this only on specific ones, this will work. Example below...

For pre-WooCommerce 2.3:

#composite_form_8594 .quantity, #composite_form_7073 .quantity {display:none!important;}

For WooCommerce 2.3+:

#composite_data_8594 .quantity, #composite_data_7073 .quantity {display:none!important;}