Decode JSON in Twig Template

tkates1foxytkates1foxy Member
in Help
We're using Berklee Online store version 2.0...still in development...not yet activated.

I have a custom field that I'm sending via the form that has HTML markup for a select tag (dropdown) to display on the checkout page...

<select>...</select>

The values used in the select tag need to be dynamically generated on our server. That's why I'm passing this in the data feed as a custom field.

Then in "Template Configuration -> Checkout -> Add custom form fields to your checkout", I have this to render the select tag...

{% if custom_fields.start_terms_select %}
{{ custom_fields.start_terms_select.value }}
{% endif %}


On the checkout page, it renders, literally, as text, not as a <select> tag. It looks like this on the page...

<select id='start_term_id'><option id='57678397' value='Summer 2019'</option><option id='57678398' value='Fall 2019'</option></select>

When I view it on the cart page's source, in the FC.json, the angle brackets have been converted to unicode (\u003C and \u003E)...
"custom_fields":{"start_terms_select":{"value":"\u003Cselect id='start_term_id'\u003E\u003Coption id='57678397' value='Summer 2019'\u003C\/option\u003E\u003Coption id='57678398' value='Fall 2019'\u003C\/option\u003E\u003C\/select\u003E","is_hidden":"1"}
I need to decode the JSON in the value of that custom field so it renders as a <select> tag and not as text.

I've tried this custom_fields.start_terms_select.value | json_decode and this custom_fields.start_terms_select.value | json_decode() , but neither of them work.

How do I decode JSON in a Twig template?
And is there a different/better way for me to approach this?
Comments
  • fc_adamfc_adam FoxyCart Team
    edited May 2
    @tkates1foxy,

    Good question - thanks for providing a detailed overview of what you're looking to do and what you've tried.

    One approach you could take here would be to send the raw values, rather than the HTML to render, and then build out the HTML within the Twig instead.

    For example, if you were able to pass the values like this: 57678397:Summer 2019|57678398:Fall 2019, then you could have Twig logic like this:
    {% if custom_fields.start_terms_select %}
    {% set options = custom_fields.start_terms_select.value|split('|') %}
    <select name='start_term_id'>
    {% for option in options %}
    {% set values = option|split(":") %}
    <option value="{{ values[0] }}" {% if start_term_id == values[0] %}selected{% endif %}>{{ values[1] }}</option>
    {% endfor %}
    </select>
    {% endif %}
    That will result in HTML like this:
    <select name="start_term_id">		
    <option value="57678397">Summer 2019</option>
    <option value="57678398">Fall 2019</option>
    </select>
    I hope that helps! Let us know if we can help any further
  • Thanks. Yes, that could work, but I was hoping to put as little logic as possible in the template, though.

    Is there no way to decode JSON in Twig?
  • fc_adamfc_adam FoxyCart Team
    @tkates1foxy,

    I understand. For what you're looking to do though - the approach I detailed above will be your best bet. Especially because of how our template re-rendering works on the checkout, the Twig logic will ensure that the customers selected option remains selected after re-renders.
Sign In or Register to comment.