How do I bind json data (by a calling REST API) depending on the contents of a column?

[kapnevets]

The figure (Figure 1) below is what i am having trouble with.

I want to calculate number of atoms and display them under atom_count column based on the column text under SMILES. I understand that weweb does not have cheminformatics API and/or plugins. So I found an external API I am using to calculate that (by using the SMILES strings under SMILES column as input). However, I am having great difficulty on how to receive the response from the GET API call and parsing the json response, and then bind the specific cell value to that specific data.

I tried writing my own javascript code and tried to use the Fetch API so I can retrieve the specific data point, but since the code block isn’t an async function ( I think… or maybe I don’t understand the custom javascript functionality ), return the "Fetch"ed data is always out of sync.

I also tried to use the weweb workflow and collection functionality. But based my understanding of collection is that it retrieves information from database. So, I tried workflows, but I can’t seem parse through the API response and bind that relevant value. I used the weweb REST API plugin to call the GET API URL and I successfully received the results! But now I am so lost on how to bind those specific data to the columns.

If you guys know how to do this in a much more streamlined way. I would appreciate it. Thanks!

Figure 1

[Alexis]

Hi, I think you are on the right track.

You can create a variable to store what you receive from the API.

Then you can use it in your workflow after the REST API request by adding a change variable value action!

In the action you can bind the result of the previous one (the result of the api request). At first nothing will show up in the explorer, you have to run your first action with the Test button to you will be able to see the result in the explorer.

Then you can bind your variable where you want to display the result

[kapnevets]

Thanks! So Is there a way to trigger the calculations for all strings in the SMILE column? That variable is only going to be able to hold only for one SMILES strings calc. And I dont want to create JS object variables for every row. Especially when you are gonna have thousands of rows of data.

[Alexis]

You have two choices

• Use an array variable instead, if the result contain a way to identify which result belong to which input, like an id

• Continue to use an object but toggle partial update on the change variable value action, you will be able to attache the result to a specific key, so your object could contain =>

{
  column1: {...result1},
  column2: {...result2}
}

So you will have one variable to store every result

Edit : I would advice you to put your columns/rows inside an array and create a repeated UI, so you dont have to manage manually hundread of inputs and workflows, you will have only one input to manager and it will be repeated for every columns you have

Edit2 : Something like that (I dont know exactly your flow so its only to show you the basics of repeat concept if you didnt know)

Edit3 : And if you want to perform every request all at once, you can use our loop system inside the workflow, by adding a loop you can iterate through your list of smiles (if you put them inside an array variable) and perform an API request for each one

[kapnevets]

OK. Cool. So I got the atom_counts showing based on the columns on the left.

But, I am about concerned about the workflow automation, can be summarized into two issues:

1. The trigger I have is “on-change”, but it already exists there so the values won’t come up. (Figure 1)
2. So…I had to run the workflow twice (“once each SMILES string”)

Figure 1

Is there an appropriate trigger on already existing data? Sort of a multi-step binding between one cell in a table with a REST API Call?

The answer you gave me was amazing, appreciate it.

[Alexis]

Could you make a short video showing me how your application works exactly ? I’m not sure to understand where do you put the on change and what is the different interaction your user have on the application, what’s the flow exactly ?

You can also describe it with bullet point if you cant do a video

For me, I see a table with two columns, and the right column is the result of a calculation based on the left column.

But I dont understand where is the on change, do you have an input before the table ? If so, you should manage the loop inside the on change of this input triggering the calculation.

[kapnevets]

No need. I think I found out a solution. thank you.!