Hello, brand new user here just getting a feel for the functionality. As a test I created an action that makes a simple request to an HTTP API which returns a JSON object. The 2nd step I wish to update a header value with a parameter from the returned JSON object.
The action executes successfully but the reference to the parameter is always null.
After execution when I hover ‘data’ in the javascript code step immediately after it shows my full json object, the first parameter is ‘createdBy’ – that shows in the hover, but when I use it as a reference, it is null undefined. Similar results if I try to map a table to an array inside the same action. AI assistant says I have the syntax right, still nothing.
I was able to figure out that the response from my API was actually a string, so I needed to return {{data}} wrapped in JSON.parse() in the Transform Result step of the request. That works nicely for subsequent steps in the Action, but I’m wondering if this is best practice or not.
Small nitpick on this is that I can’t directly bind the output to a table for example as it doesn’t recognize the transformed output. Further to this, is there a way to bind to a subarray inside {{data}} ? I’ve tried things like binding to {{actions.myAction.data.subarray}} but syntax fails. Do I use a state variable or something? I’ve been able to leave the Data field blank and populate it in code, but wondering if there’s a better way.
It depends. If you receive large objects via API, it could make a difference in loading speed for users if the data is already sent in JSON format. But generally, it’s not wrong in any way to send data as a string and parse it at a later moment.
Regarding your second issue. I’m not sure if I understand what exactly you’ve tried doing, I recommend sharing snippets of what you are trying, so people can see what’s going on. But directly binding the output to a table is fairly easy:
Data arrives as string, and therefore we parse the result in the Transform result part of the step. Plus, so it can be used as data for a table, if its not already an array we’ll return it as one
Just make sure the table receives an array [] and not just an object {}. And as I said before already, it would be really helpful for helping you if you could share some snippets
Sorry if I ping pong a bit on the questions as I try some stuff – I was able to bind the table to a subarray when it was defined in javascript code and assigned to a state variable. Should state variables be used liberally like this vs using a statement in javascript: ui.table.setData(jsonData);
Secondly I’m playing around with query params on an HTTP Request – I am able to populate it from the value of a textbox on the UI dynamically – but it’s bypassing the Query Params feature of the Request component - How do I address that query param programatically?
It’s definitely not wrong to use a state variable for a table, especially when the value is modified a lot. But there are many ways to set the data for a table. The “default” basic way, in your case here, would be to set the Data setting of the table to your getItems action and simply returning the subarray like return jsonData;. But that is more useful when you have a table that only needs to be populatet with data once or few times.
In the line
ui.heading.setText({{data.dbName}})
the whole thing should be enclosed in curly brackets like
{{ ui.heading.setText(data.dbName) }}
as you should with all UI Bakery custom objects and references (ui.xxx, actions.xxx, states.xxx, etc.).
Even if the used variable is just a normal JS object like here:
Lastly, the query params. You already have one of the two ways to add query params implemented. Using menuID={{ui.guid.value}} adds the query param and you the server will receive it:
