Querying Web API

Hi. I need help with this. Do you think you have the solution for this?

API Link: https://neelpatel05.pythonanywhere.com/
Thunkable Link: Thunkable
There are 119 periodic elements. I want it to work something like when hydrogen is click in 2nd screen it will display info related to it in 3rd screen (INFO SCREEN) by fetching it from API.

What is and is not working in your project?

I don’t even see hydrogen on the screen so I’m not sure how you would test this.

When I paste your API url response into https://codebeautify.org/jsonviewer, I can see that the “symbol” property is at array–>0–>symbol which in Thunkable would be the property “1.symbol” of the array object. So you would want to check if that symbol is equal to the one clicked (“H”).

if you go with what your are contemplating you will end up with 119 screens!
what you need is one screen and one way (or 2 ways) to put the information to the screen.

  1. one way is to let the user enter the atomic number, eg. 1, and after you click the button, it will show the screen will show the information for hydrogen…
  2. another way is to let the user enter the name of the element, “He” , and it should bring up the Helium.

i see you have the full periodic table as a table in json format. it means you can access them selectively by array posiition. ie. array location 1 points to Hydrogen, location 2 points to Helium, location 3 to Lithium, etc.so it is easiest to access any element by array location .

if you want your user to use atomic number , you’ll need to build a table of atomic numbers. similarly you willl need a separate table of element names… if you can find the element in one of these tables, its location number can be used to index into the json table so you get all the information related to the element directly.

so put together some blocks and try it yourself and if you get stuck show us your blocks and someone will try to help you.

1 Like

Hi Manyone Thanks for your response. If you look at the design in screen 1 it contains invisible buttons upon each element. When clicked on let’s say hydrogen it takes us to next screen wherein it will fetch information from API and display.

Screenshot 2023-02-11 143820

you’re missing out on one of the best features in thunkable - any component block - or what i started calling as “indexible buttons” (or components).
please read this tutorial to give you an idea if this process would work for you.

the outcome is you end up with a table of buttons that are numbered button1 to buttonP (where P is total rows times total columns). you will need an internal table ot translate that button1 is for the location of H in the json table, that buttons 2 thru 17 are not used but button18 points to the location of He in the json table.
when any button is pressed, you get a number that can be translated to an index, and the index can be used to get the element info from json table.

but the way you’ve started coding it, you will end up with coding 119(!) When_Buttonxx_Clicked blocks!
i dont know enough thunkable internals - the way you chose may be faster because each button is directly related to a when_clicked block.

if you still want to ability to successive displays of element in sequence, you stilll need the internal table i described above so if you know that button 39 was pressed, you know that the next button will be button 40. you wont need to check if button-sulfur is followed by button-chlorine.
this is just my observation - you may receive other suggestions from other thunkable users. good luck.

1 Like