How do I make individual options within the product option select lists disabled when out of stock?

Highlighted
New Member
2 0 0

I have the following setup in my custom theme product template but it doesn't work.

By "doesn't work" I mean simply that no option is ever disabled, even though product variants are definitely out of stock.
So product.available clearly isn't right here.   What am I doing wrong ?

 

{% if product.variants.size > 1  %}
  {% for option in product.options_with_values %}
  <label for="SingleOptionSelector-{{ forloop.index0 }}">{{ option.name }}</label>
  <select class="form-control selector-option-{{ option.name }}" id="SingleOptionSelector-{{ forloop.index0 }}">
  {% for value in option.values %}
  {% if product.available %}
    <option {% if option.selected_value == value %}selected{% endif %} value="{{ value | escape }}">{{ value }} </option>
    {% else %}
      <option disabled="disabled" {% if option.selected_value == value %}selected{% endif %} value="{{ value | escape }}">{{ value }}</option>
        {% endif %}
{% endfor %}
  </select>
  {% endfor %}
{% endif %}

 

 

0 Likes