Remove variation in Woocommerce cart

Question

I have a pizza with multiple ingredients. If the user ticks an "Add Ingredients" box the choices come up as drop downs defaulted at "none". I need to get the "none" selected options to hide in the cart and checkout.

I've got them to hide in the cart page but they still show in the masthead cart and the checkout.

Here is some of the code displaying the ingredients:

  <li>Add Ingredients?</li> </ul> </dd> <dt class="variation-GreenOlives">Green Olives:</dt> <dd class="variation-GreenOlives"> <p>Whole Pizza ($1.00)</p> </dd> <dt class="variation-RipeOlives">Ripe Olives:</dt> <dd class="variation-RipeOlives"> <p>None</p> </dd> <dt class="variation-SlicedTomatoes">Sliced Tomatoes:</dt> <dd class="variation-SlicedTomatoes"> <p>None</p> </dd> <dt class="variation-FreshMushrooms">Fresh Mushrooms:</dt> <dd class="variation-FreshMushrooms"> <p>None</p> </dd> <dt class="variation-ArtichokeHearts">Artichoke Hearts:</dt> <dd class="variation-ArtichokeHearts"> <p>None</p> </dd> <dt class="variation-CannedMushrooms">Canned Mushrooms:</dt> <dd class="variation-CannedMushrooms"> <p>None</p> </dd> <dt class="variation-FreshBasil">Fresh Basil:</dt> <dd class="variation-FreshBasil"> <p>None</p> </dd> <dt class="variation-Spinach">Spinach:</dt> <dd class="variation-Spinach"> <p>None</p> </dd> <dt class="variation-Pepperjack">Pepperjack:</dt> <dd class="variation-Pepperjack"> <p>None</p> </dd> <dt class="variation-ExtraCheese">Extra Cheese:</dt> <dd class="variation-ExtraCheese"> <p>None</p> </dd> <dt class="variation-Cheddar">Cheddar:</dt> <dd class="variation-Cheddar"> <p>None</p> </dd> <dt class="variation-Swiss">Swiss:</dt> <dd class="variation-Swiss"> <p>None</p> </dd> 

And here is the code that is hiding the "none" options on the cart page:

 function hideNone(){ $(document).ready(function(){ $("dd>p:contains('None')").hide() && $("dd").prev().hide(); }); } 

So even though the code is the same on all three of the places the order shows, this code is only hiding it on the cart page. I'm using woocommerce and gravity forms on a local install. Thanks for your help.

Answer 1

The problem I think is that you have declared the function hideNone() and haven't called the function. $( document ).ready() is actually used for calling a function when the document is loaded, that means that is not need to be a function definition. See the documentation.

  $(document).ready(function() { $("dd>p:contains('None')").hide() && $("dd").prev().hide(); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> <dt class="variation-GreenOlives">Green Olives:</dt> <dd class="variation-GreenOlives"> <p>Whole Pizza ($1.00)</p> </dd> <dt class="variation-RipeOlives">Ripe Olives:</dt> <dd class="variation-RipeOlives"> <p>None</p> </dd> <dt class="variation-SlicedTomatoes">Sliced Tomatoes:</dt> <dd class="variation-SlicedTomatoes"> <p>None</p> </dd> <dt class="variation-FreshMushrooms">Fresh Mushrooms:</dt> <dd class="variation-FreshMushrooms"> <p>None</p> </dd> <dt class="variation-ArtichokeHearts">Artichoke Hearts:</dt> <dd class="variation-ArtichokeHearts"> <p>None</p> </dd> <dt class="variation-CannedMushrooms">Canned Mushrooms:</dt> <dd class="variation-CannedMushrooms"> <p>None</p> </dd> <dt class="variation-FreshBasil">Fresh Basil:</dt> <dd class="variation-FreshBasil"> <p>None</p> </dd> <dt class="variation-Spinach">Spinach:</dt> <dd class="variation-Spinach"> <p>None</p> </dd> <dt class="variation-Pepperjack">Pepperjack:</dt> <dd class="variation-Pepperjack"> <p>None</p> </dd> <dt class="variation-ExtraCheese">Extra Cheese:</dt> <dd class="variation-ExtraCheese"> <p>None</p> </dd> <dt class="variation-Cheddar">Cheddar:</dt> <dd class="variation-Cheddar"> <p>None</p> </dd> <dt class="variation-Swiss">Swiss:</dt> <dd class="variation-Swiss"> <p>None</p> </dd>