Help displaying JSON data

[yohann_rougier]

Hi everyone,

I’m trying to make a simple app that would take a picture of a recipe from a book and have ChatGPT extract only the ingredient part and send it to a collumn so I could display it, ideally as a list.

ChatGPT works well, and I can display the text in my page. But I’d like to have all the ingredients displayed as a list, so after I could extract them and do a shopping list for example. I asked ChatGPT to format in JSON for example but I can’t find a way to display the ingredients in a list.

Here is a screenshot of my collumn:

[Uzo]

Use the javascript column to unpack the JSON…

Paste that JSON here… someone will give you a code for that.

[Jeff_Hager]

To get you started, try something like this in a Query JSON column.

ingredients.($.ingredient & '
')

[yohann_rougier]

Thanks guys for your help.

First I changed Chat GPT model, and swichted to GTP4 Vision. And used a better prompte to end up with a clean JSON Object. (sceenshop provided)

I used your advice of using a JSON Queries. I extract the Title with one query, the instruction in an other. But for the ingredients and there recipe I do the same but it ca be a lot of ingredients so a lot of collums. I stoped at 5 ingredients to test.

Everything is working but it feels like a lot of computing and I feel there is a better way to use JSON Objects?

Prompt

ChatGPT model:

Actual JSON Object result:

THe loooong list of Qty and Ingredients

[Uzo]

You need a helper table to unpack that JSON into a list… I would use Javascript for that…
paste that JSON here… I will give you the code…

try it…