Small Shopify Liquid Bug - Variant Select with Price Calculation

Job ID: 36984860

Budget: €8 – €30 EUR

I have a Shopify store with a product page that has two variant select options, "SIZE" and "FRAME." The "SIZE" select is currently showing variant prices correctly. However, I'm facing an issue implementing the extra cost at the "FRAME" select.

Here's how it should work:

When the user selects a value from the "SIZE" select, the corresponding variant price is displayed correctly (e.g., "A4 PRINT - 100 €") then the FRAME select have to be update with FRAME price.

Calculation TOTAL PRICE (180 €) minus CURRENT SIZE VARIANT (100 €) = FRAME PRICE (80 €)

——————

{%- for value in option.values -%}
{%- liquid
assign option_disabled = true
assign variant_price = ''

for variant in product.variants
case option.position
when 1
if variant.option1 == value and variant.available
assign option_disabled = false
assign variant_price = variant.price | money
break
endif
when 2
if variant.option1 == product.selected_variant.option1 and variant.option2 == value and variant.available
assign option_disabled = false
assign variant_price = variant.price | money
assign total_amount = variant.price | minus: product.price | money
break
endif
when 3
if variant.option1 == product.selected_or_first_available_variant.option1 and variant.option2 == product.selected_or_first_available_variant.option2 and variant.option3 == value and variant.available
assign option_disabled = false
assign variant_price = variant.price | money
break
endif
endcase
endfor
-%}

{%- if block.settings.picker_type == 'button' -%}
<!-- Button-based variant picker code remains unchanged -->
{%- elsif block.settings.picker_type == 'dropdown' -%}
<option
value="{{ value | escape }}"
{% if option.selected_value == value %}
selected="selected"
{% endif %}
data-variant-price="{{ variant_price }}"
data-total-price="{% if option.position == 2 and total_amount != '' %}{{ total_amount }}{% endif %}"
>
{% if option_disabled -%}
{{- 'products.product.value_unavailable' | t: option_value: value -}}
{%- else -%}
{{- value -}} - {% if option.position == 2 and total_amount != '' %}{{ total_amount }}{% else %}{{ variant_price }}{% endif -%}
{%- endif %}
</option>
{%- endif -%}
{% endfor %}
Related categories: PHP JavaScript Software Architecture HTML Shopify