Jon Morgan
Jon Morgan

Reputation: 37

Trouble Displaying a Product's Price in Stencil Conditional Statement

I'm using the Cornerstone theme in BigCommerce. On my product page, I need to hide pricing unless the end user is logged in. BigCommerce has this feature, but it's all or nothing and I only want to restrict certain items from displaying their price. I am using a custom field at the product level named HidePrice. This custom field has either a True or False defined for each product on my site. There are three conditions I need to account for...

  1. The end user is logged in: Display the price regardless of what the HidePrice value is
  2. The product's HidePrice value = false: Display the product's price
  3. The product's HidePrice value = true and the end user is NOT logged in: Suppress the product's price and display an alternate "Too low to show" message.

Here's my code that isn't quite working...

<div class="productView-price">
    {{#if customer}}
        {{#if product.can_purchase}}
            <p class="productView-price">
                <span>Price: {{product.price.without_tax.value}}</span>
            </p>
        {{/if}}
    {{else}}
        {{#filter product.custom_fields 'HidePrice' property='name' }}
            {{#if (toLowerCase value) '==' 'true'}}
                <div class="too-low-to-show">This product is priced too low to show!</div>
            {{else}}
                <p class="productView-price">
                    <span>Price: {{product.price.without_tax.value}}</span>
                </p>
            {{/if}}
        {{/filter}} 
    {{/if}}
</div>

The piece I can't seem to get working is condition #1 above (The product's HidePrice value = false: Display the product's price). Conditions #2 & #3 work just fine but the price simply never displays when the requirements of condition #1 are met. Oddly, the "Price:" label I've pre-pended just before the price handlebar will display but the price handlebar itself seems to be ignored by BigCommerce. I have found that if I use the same price handlebar outside of my conditional statement, it will render on the page. I'm baffled by this one. Any help would be greatly appreciated. Thanks!

Upvotes: 0

Views: 383

Answers (1)

Matt Coy
Matt Coy

Reputation: 1101

I believe the issue here is simply scope. Once you enter the filter condition, you have left the global scope and entered the product.custom_fields scope. You no longer have access to the product object. A simple fix for this should be to go back up a level by appending "../" in front of product.price.

<div class="productView-price">
{{#if customer}}
    {{#if product.can_purchase}}
        <p class="productView-price">
            <span>Price: {{product.price.without_tax.value}}</span>
        </p>
    {{/if}}
{{else}}
    {{#filter product.custom_fields 'HidePrice' property='name' }}
        {{#if (toLowerCase value) '==' 'true'}}
            <div class="too-low-to-show">This product is priced too low to show!</div>
        {{else}}
            <p class="productView-price">
                <span>Price: {{../product.price.without_tax.value}}</span>
            </p>
        {{/if}}
    {{/filter}} 
{{/if}}
</div>

Upvotes: 1

Related Questions