JSON parsing from text properties

Hi everyone!

In my template (quotes) I want to add a custom section with a table of “included objects” (thery are not product/prices, but let’s say a description of what has been considered in the quote).
It’s a 4 column table with a variable number of rows.
My approach is: store JSON as string in a deal property, pull it and parse HubL and let it populate the table.
I am having issues with the from_json filter for parsing it, it seems not to work even on the simplest debugging test.
I tried this code:

{% from ‘../../imports/mock_data.html’ import SAMPLE_TEMPLATE_DATA as mock_data %}
{% set QUOTE = template_data.quote || mock_data.quote %}

<section>
<h3>Debug Raw lista_oggetti</h3>
<!-- Display lista_oggetti as raw text -->
<pre>{{ QUOTE.associated_objects.deal.lista_oggetti }}</pre>
</section>

<section>
<h3>JSON Parsing Step-by-Step Debug</h3>
<!-- Step 1: Fetch the raw string -->
{% set lista_oggetti = QUOTE.associated_objects.deal.lista_oggetti %}
<h4>Raw String</h4>
<pre>{{ lista_oggetti|default(“No lista_oggetti found”) }}</pre>

<!-- Step 2: Try to parse the string -->
{% set lista_oggetti_parsed = lista_oggetti|default(‘[]’)|from_json %}
<h4>Parsed JSON (from_json)</h4>
<pre>{{ lista_oggetti_parsed|default(“Parsing failed or no objects found”) }}</pre>

<!-- Step 3: Check the parsed JSON structure -->
{% for item in lista_oggetti_parsed %}
<h4>Parsed Object:</h4>
<pre>{{ item|tojson }}</pre>
{% else %}
<p>No objects found in parsed JSON.</p>
{% endfor %}
</section>

<section>
<h3>Fixing JSON Parsing</h3>
<!-- Step 1: Display raw string -->
{% set raw_json = QUOTE.associated_objects.deal.lista_oggetti %}
<h4>Raw JSON String:</h4>
<pre>{{ raw_json|default(“No lista_oggetti found”) }}</pre>

<!-- Step 2: Remove escaped characters -->
{% set clean_json = raw_json|replace(‘\\"’, ‘"’)|replace(‘\\n’, ‘’) %}
<h4>Cleaned JSON String:</h4>
<pre>{{ clean_json }}</pre>

<!-- Step 3: Parse cleaned JSON -->
{% set parsed_json = clean_json|from_json %}
<h4>Parsed JSON:</h4>
<pre>{{ parsed_json|default(“Parsing failed or no objects found”) }}</pre>

<!-- Step 4: Debug parsed JSON structure -->
{% for item in parsed_json %}
<h4>Parsed Object:</h4>
<pre>{{ item|tojson }}</pre>
{% else %}
<p>No objects found in parsed JSON.</p>
{% endfor %}
</section>

<section>
<h3>Hardcoded JSON Parsing Test</h3>
{% set test_json = ‘[{“Oggetto”: “Test1”, “Stanza”: “Room1”, “Quantità”: 1, “IC”: “✓”, “Note”: “Note1”}, {“Oggetto”: “Test2”, “Stanza”: “Room2”, “Quantità”: 2, “IC”: “✗”, “Note”: “Note2”}]’ %}
<h4>Hardcoded JSON String:</h4>
<pre>{{ test_json }}</pre>
{% set parsed_hardcoded_json = test_json|from_json %}
<h4>Parsed Hardcoded JSON:</h4>
<pre>{{ parsed_hardcoded_json|default(“Hardcoded Parsing Failed”) }}</pre>
</section>

<section>
<h3>Simple Parsing Test</h3>
{% set simple_json = ‘{“key”: “value”}’ %}
<h4>Raw JSON String:</h4>
<pre>{{ simple_json }}</pre>
{% set parsed_simple_json = simple_json|from_json %}
<h4>Parsed Output:</h4>
<pre>{{ parsed_simple_json|default(“Simple Parsing Failed”) }}</pre>
</section>

Basically everything works well until I try to parse with from_json. Json string are valid json verified many times.
Ideas?

Hi, @05311 :waving_hand: Thanks for including your details and where you are getting stuck. I’d like to ask some of our community members if they have any relevant experience with similar issues — hey @AnzeKoprivec @Anton @jonchim, can you lend a hand here?

Thank you very much for taking a look! — Jaycee

Storing code in properties definetly works but I’ve had success with this only with Javascript/React code, HubL not so far, specially because I don’t think we have any methods for stringifying and parsing it with HubL and doing this with javascript isn’t possible since HubL is a server side templating language.
I think there are better ways to solve your problem, why not just use a custom module? You can store the dynamic variables as deal properties and then just take those values in the module.
Storing HubL on a property should be possible, the only concern is rednering it out. I would try this filter if anything but I still believe the appraoch is wrong and there are better ways to do what you’re looking for.
Escape JSON would be for getting out of JSON.stringify

{{ escape_string|escapejson }}

But if you will just wrap your HTML + HubL with a single string then you should be able to just render this directly with

{{ property }}

otherwise using something like the |replace filter might be worth a try.