[🌟 New Features: Ultra-Deep Drill] JSON Assistant Plugin: Your Solution to Complex JSON & API Data in Bubble

[victorkiarie]

I have really tried to follow the tutorial but I just cant seem to go past the repeating group part.
I have a JSON from an API response about climate data. this is how it looks like below. I want this data to go into my database as the six parameters listed : “ALLSKY_SFC_SW_DWN”, “PRECTOTCORR”, “RH2M”, “T2M”, “WD10M”, “WS10M” I then want these figures on charts using your charts plugin.
The images below show the exact place i get stuck.

Kindly Help.

here is the JSON

{
“type”: “Feature”,
“geometry”: {
“type”: “Point”,
“coordinates”: [36.796, 1.292, 1269.79]
},
“properties”: {
“parameter”: {
“ALLSKY_SFC_SW_DWN”: {
“JAN”: 274.96,
“FEB”: 288.07,
“MAR”: 279.36,
“APR”: 257.01,
“MAY”: 259.71,
“JUN”: 241.74,
“JUL”: 231.52,
“AUG”: 251.34,
“SEP”: 279,
“OCT”: 260.82,
“NOV”: 245.64,
“DEC”: 256.28,
“ANN”: 260.45
},
“PRECTOTCORR”: {
“JAN”: 0.82,
“FEB”: 0.55,
“MAR”: 1.54,
“APR”: 2.9,
“MAY”: 1.45,
“JUN”: 0.95,
“JUL”: 1.2,
“AUG”: 1.22,
“SEP”: 0.72,
“OCT”: 1.43,
“NOV”: 2.24,
“DEC”: 1.53,
“ANN”: 1.38
},
“RH2M”: {
“JAN”: 54.2,
“FEB”: 50.47,
“MAR”: 53.8,
“APR”: 63.24,
“MAY”: 62.22,
“JUN”: 58.75,
“JUL”: 57.88,
“AUG”: 56.49,
“SEP”: 51.63,
“OCT”: 55.6,
“NOV”: 66.28,
“DEC”: 61.92,
“ANN”: 57.71
},
“T2M”: {
“JAN”: 22.64,
“FEB”: 23.79,
“MAR”: 24.46,
“APR”: 23.85,
“MAY”: 23.6,
“JUN”: 22.98,
“JUL”: 22.44,
“AUG”: 22.79,
“SEP”: 23.75,
“OCT”: 23.81,
“NOV”: 22.63,
“DEC”: 22.25,
“ANN”: 23.25
},
“WD10M”: {
“JAN”: 102.6,
“FEB”: 103.8,
“MAR”: 104,
“APR”: 106.7,
“MAY”: 109.6,
“JUN”: 103.5,
“JUL”: 101.4,
“AUG”: 105.2,
“SEP”: 107.9,
“OCT”: 107.9,
“NOV”: 102.6,
“DEC”: 101.1,
“ANN”: 104.8
},
“WS10M”: {
“JAN”: 4.74,
“FEB”: 5.24,
“MAR”: 5.31,
“APR”: 5.14,
“MAY”: 4.46,
“JUN”: 3.68,
“JUL”: 3.41,
“AUG”: 3.77,
“SEP”: 4.86,
“OCT”: 5.69,
“NOV”: 5.31,
“DEC”: 4.85,
“ANN”: 4.7
}
}
},
“header”: {
“title”: “NASA/POWER Source Native Resolution Climatology Climatologies”,
“api”: {
“version”: “v2.6.5”,
“name”: “POWER Climatology API”
},
“sources”: [
“POWER”,
“MERRA2”,
“SYN1DEG”
],
“fill_value”: -999,
“time_standard”: “LST”,
“range”: “20-year Meteorological and Solar Monthly & Annual Climatologies (January 2001 - December 2020)”
},
“messages”: [
“The requested parameters are retrieved from a pre-computed climatological period (January 2001 - December 2020)”
],
“parameters”: {
“ALLSKY_SFC_SW_DWN”: {
“units”: “W m-2”,
“longname”: “All Sky Surface Shortwave Downward Irradiance”
},
“PRECTOTCORR”: {
“units”: “mm/day”,
“longname”: “Precipitation Corrected”
},
“RH2M”: {
“units”: “%”,
“longname”: “Relative Humidity at 2 Meters”
},
“T2M”: {
“units”: “C”,
“longname”: “Temperature at 2 Meters”
},
“WD10M”: {
“units”: “Degrees”,
“longname”: “Wind Direction at 10 Meters”
},
“WS10M”: {
“units”: “m/s”,
“longname”: “Wind Speed at 10 Meters”
}
},
“times”: {
“data”: 1.964,
“process”: 0.08
}
}

[NoCodeDataArtisan]

Hello @victorkiarie

As we discussed via email, the challenge we are faced here is the JSON structure. We need to convert it to this structure:

[
  { "parameter": "ALLSKY_SFC_SW_DWN", "month": "JAN", "value": 274.96 },
  { "parameter": "ALLSKY_SFC_SW_DWN", "month": "FEB", "value": 288.07 },
  { "parameter": "ALLSKY_SFC_SW_DWN", "month": "MAR", "value": 279.36 },
  { "parameter": "PRECTOTCORR", "month": "JAN", "value": 0.82 },
  { "parameter": "PRECTOTCORR", "month": "FEB", "value": 0.55 },
  { "parameter": "RH2M", "month": "JAN", "value": 54.2 },
  ...
]

We can use JSONata to modify the JSON. You can use Chat GPT to help you through the writing of the JSONata expression.

Also, you can use this link to test the expression easier:
JSONata Exerciser

[amitshemla]

Hi ! need help with this plugin, i have purchased and i am not sure how to extract this json
i wanted to have a custom state (text) for: title, notes, and client,
also, in my db i have “review” db with “review_name” and “review_text” fields like in the JSON

{
“title”: “Book Summary – The Secret Garden”,
“total_price”: “29.99”,
“reviews”: [
{
“reviewer_name”: “Emily R.”,
“review_text”: “A magical and uplifting story. The garden metaphor was beautifully written and the character growth was touching.”
},
{
“reviewer_name”: “BookLover_92”,
“review_text”: “Absolutely loved it! I read it as a child and revisited it as an adult. Still powerful and meaningful.”
},
{
“reviewer_name”: “TheoReads”,
“review_text”: “Some parts were slow, but overall it’s a beautiful reminder of the healing power of nature and connection.”
}
],
“notes”: “Collected from multiple book review platforms for educational purposes.”
}

How can i get this data? should i use custom key or what should i do? thank you very much!
@NoCodeDataArtisan

EDIT:
I just realize that when i putting the json element and then ask for “jsonextractor A values of key 1”
then i am getting the title
same for key 2 (getting the total) which is great
now i just need to solve the review list, i tried to use rg but no success, thanks!!

the only thing i need is to extract values of key 4 but this is a list and not text

[NoCodeDataArtisan]

Hello @amitshemla ,

I hope you’re doing well.

@amitshemla

now i just need to solve the review list, i tried to use rg but no success, thanks!!

Regarding the reviews you need to check the Deep Drill option of the element to get all inner values.

However, I suggest you use the JSONata element that is more powerful and flexible element to get data from any JSON.
You can check out its demo on this page: JSON Assistant

To extract data, JSONata needs an expression to address the values you need then you can convert the result to bubble data type and use it directly on elements like RG.

[rodrig.naska]

Hi @NoCodeDataArtisan is there a way to enable Deep Digging for Things to JSON with the server-side (backend) workflows?

[NoCodeDataArtisan]

Hi @rodrig.naska,

I hope you’re doing well.

I attempted to implement this feature, but it crashes when dealing with nested lists and certain other scenarios.

You might consider using Bubble’s ‘Data API’ option—it’s both powerful and secure.

[benjaminlukeb]

Hi there @NoCodeDataArtisan
I am trying to Extract data from a file, that is referencing a URL inside Bubble.io file manager, can the JSONExtractor use data from a file to produce the outputs?
Also; Would this work for a S3 bucket URL that is public?
In both instances, this file would be a .json file, and the payload is within (as expected), and accessible (permissions given).

Thank you for your help

Example below: File from bubble.io’s file manager. .JSON file, though the plugin does not seem to be able to read the information within / inside it.

[NoCodeDataArtisan]

Hello @benjaminlukeb,

I hope you’re doing well.

If you have a .json file and its URL, you can easily create an API call with the file’s address as a parameter. Then, call the API and insert the raw body text as the source for the plugin.

Let me know if you need any further clarification!

[boston85719]

@NoCodeDataArtisan

If you have a .json file and its URL, you can easily create an API call with the file’s address as a parameter.

Awesome! I had not been able to land on the easiest approach to make the file available to Bubble to easily download on page load…this is amazing! You are my Hero

1,000 Products loaded into the RG in less than 2 seconds for a total of 0.72 WUs plus the 0.15 page load. That is only 0.00072 WUs per object returned.

That is 95.2% less WUs per thing returned than what Bubble charges! Outrageous.

Thing #2 is about 95.2% cheaper than Thing #1. Here’s the math:

1. Difference in cost:0.015−0.00072=0.014280.015 - 0.00072 = 0.014280.015−0.00072=0.01428
2. Relative to Thing #1’s cost:0.014280.015≈0.952\frac{0.01428}{0.015} \approx 0.9520.0150.01428​≈0.952
3. As a percentage:0.952×100%=95.2%0.952 \times 100% = 95.2%0.952×100%=95.2%

Alternatively, Thing #2 costs only

0.000720.015×100%≈4.8%\frac{0.00072}{0.015} \times 100% \approx 4.8%0.0150.00072​×100%≈4.8%

of the price of Thing #1, meaning it’s 95.2% less expensive.

[manipaje]

@NoCodeDataArtisan

I’ve got several { } Things → JSON elements on my page, a single dropdown selects an API item and then each one triggers the next (when ready). It works perfectly for the first time I select a dropdown item. However, I am struggling to ‘reset’ my { }Things → JSON. I just want to remove their data and effectively start again when the dropdown changes. Is there a way to achieve this? I am struggling to find a solution independently.

Error:

The plugin JSON Assistant / action Run a { } Things to JSON threw the following error: TypeError: Cannot read properties of undefined (reading ‘listProperties’)
at Object.thingsToJSON (PLUGIN_1678013090975x934827621976899600/JSON-Assistant-initialize------Things-to-JSON-.js:3:1046)
at eval (PLUGIN_1678013090975x934827621976899600/JSON-Assistant-element_action------Things-to-JSON-Run-.js:3:336) (please report this to the plugin author)

[NoCodeDataArtisan]

Hello @manipaje,

Typically, when you modify any of an element’s inputs, the plugin should restart—unless an error occurs during the process.

Does the dropdown work correctly for all options the first time, or do some fail to function even on the initial selection? Let me know, and I’d be happy to help troubleshoot!

[manipaje]

Thanks for the reply. I have several { } Things to JSON in a chain.

Dropdown is changed → an ID is captured
ID is used to Run Things to JSON 1
Things to JSON 1 is Ready → Run Things to JSON 2
Things to JSON 2 is Ready → Run Things to JSON 3 (on a condition), Things to JSON 4 (on condition), Things to JSON 5 (on condition)

My challenge is the initial ID input drives the chain and each Things to JSON is reading an API for data. When that data changes, not all of the conditions are met, and the Things to JSON don’t run. However, I also need to clear them of their existing data and when I run them with an empty API result, I get the error (Cannot read properties of undefined (reading ‘listProperties’)). I tried to change their API call to something that will produce an empty array, to satisfy the error but I wasn’t having much luck and hoped there was an easier ‘reset’ process when multiple Things to Data are used in this way. Happy with a ‘creative’ solution!

[NoCodeDataArtisan]

It is a highly complex sequence, and such use cases may result in errors for various reasons

If you’re using API as data for Things to JSON, why don’t you use Raw body text choice of the API that provide you the data as JSON? Then you can easily extract any part of the JSON with JSONata element.

[manipaje]

Thank you for the suggestion. I didn’t know how complex the request was - but I take your advice to hand. Bubble’s ‘raw body text’ is only reliable when you include ‘Include errors in response and allow workflow actions to continue’. I’ve found it can otherwise be empty (which must be a bug). I’m now capturing the raw body text for the API queries and, using JSON Extractor on the keys to then run a condition to take the next action. I’ve currently removed Things → JSON from the final workflow stages, as the raw json is good enough (for now) in my application.

For the sake of sharing: a ‘clear / reset’ on the Things → JSON would’ve still been useful in my workflow.

[humberto1]

Hi,

I need some help with the implementation, and I’ll try to explain the context as clearly as possible:

Regarding the plugin:

• I have an external application (outside of Bubble) that send a credit card statement in PDF format via API, extracts the text, and returns a JSON response.
• This JSON is returned as raw escaped text, which I store in a text field (type: text) in Bubble’s database.
• I then use the JSONExtractor to parse this content.
• The parsed result (via “Convert to data type”) is stored in a custom state.
• This custom state serves as the data source for a repeating group that displays each item in the JSON.

Inside each cell of the repeating group, I have:

• Date input (initial content points to the related field in the custom state in all inputs)
• Description input
• Current instalment input
• Total instalments input
• Value input
• Delete icon — removes the item from the list
• Edit icon — enables editing of the inputs
• Save icon — appears after the user edits, replaces the edit icon
• Add icon (outside the repeating group) — adds a new item to the JSON

The challenge:

I’m struggling to implement the delete, edit, and add functions in a way that works consistently together. I’ve been trying for several days (with help from ChatGPT), but every time I fix one part, something else breaks.

I’ve attached a screenshot for visual reference.

I’m based in Brazil — sorry if my explanation is unclear. I’d appreciate any help you could offer. Let me know if you need more technical details.

Thank you!!

[NoCodeDataArtisan]

Hi @humberto1,

Hope you’re doing well, and thank you for the thorough explanation of your project setup!

From what you’ve described, it looks like you’re using the JSONata element. When using the “Convert to data type” feature, please ensure that the JSON inserted into the API contains all the future keys expected—and that their value types are correctly defined. This helps prevent issues during data transformation.

Regarding the Add and Remove functions: These expressions can become quite complex if implemented manually, which is why we’ve built them into the element as actions. We highly recommend using those built-in actions for smoother handling.

Add icon (outside the repeating group) — adds a new item to the JSON If this icon triggers the addition of a new key, make sure to define that key in the mock API so it can be recognized and converted properly later on.

Edit icon — enables editing of the inputs > Save icon — appears after the user edits, replaces the edit icon When editing items, please double-check that you’re targeting the correct item in the JSON structure and that the data maintains a valid JSON format afterward.

Let us know if you’d like to go over your setup in more detail—we’re happy to help troubleshoot or optimize further!

[marcel_myl]

Hello there!

I think this plugin is just what I’m looking for, I have a question on some of the features before I buy, would be grateful if someone that has used it could provide some feedback!

1. On the “Ultra-Deep Drilling”, does that work with multiple layers or just 2? The JSON I need to process has 4 layers total (though I could potentially reduce to 3, just wouldn’t be as nice). From the demo app it looks like it might be 2 layers but would be great if someone can confirm.
2. The JSON I’m getting back from the API is in escaped format, wondering if the plugin can handle that by default or if I have to unescape it before I use the plugin?

Thank you so much!

[anil.amesur]

@NoCodeDataArtisan Thanks for the plugin. Been useful so far. A few questions.

1. Is it possible to enable Deep Digging on the server side?
2. If not, can we use the JSONata Server action to create the desired JSON with nested objects and return it as a response to an API?

[dhlewis]

Hello @NoCodeDataArtisan -

First of all, THANK YOU for such an awesome plugin - every day I’m getting better and better and using it for really complex JSON backend parsing.

However, I think I’ve run across a bug.

I have a JSONATA expression that generates a list of objects like:

[ {
“Header”: “Income”,
“Account”: “Design income”,
“Columns”: [
“0”,
“0”,
“0”,
“0”,
“0”,
“225.000”,
“60637.500”,
“0”,
“0”,
“0”,
“0”,
“0”,
“60862.500”
]
},
{
“Header”: “Income”,
“Account”: “Discounts given”,
“Columns”: [
“0”,
“0”,
“0”,
“0”,
“0”,
“0”,
“-8.750”,
“0”,
“0”,
“0”,
“0”,
“0”,
“-8.750”
]
}
The tool correctly parses the entire JSON and creates the outputs fine.

However, when I try to associate it with a datatype of structure:

{
“Header”: “string value”,
“Account”: “string value”,
“Columns”: [
“string value”
]
}
It throws a runtime error and doesn’t populate the output datatypes. Here is the error message:

The plugin JSON Assistant / element { J: } JSONata threw the following error: TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator)) at Array.from () at array_from (https://glorafi-88058.bubbleapps.io/package/run_debug_js/4dd1b5f686727d8a081eefae0cc725cf60b74103c1d7e6cf3a0e028de297a055/xfalse/x30/run_debug.js:121:136837) (please report this to the plugin author)

Maybe it has something to do with the list field in the output type?

If I can’t do this, any ideas on how to work around this?

Thanks!

Yours,

Dennis

[darren.james7518]

The plugin is broken - it’s caching old field names and won’t update. Even if you delete the plugin and rename the field it only remembers the very first name.