I am having trouble parsing the JSON in livecode

Question

I'm trying to create a simple mobile app that queries an API and parses the response to display certain values.

The mobile has 2 fields viz:

1. Button to query the api
2. Large text box to display the contents

In my livecode stack, I've the following inclusions:

1. JSON Library
2. mergJSON
3. tsNet

The api response is as follows:

{
  "data": [
    {
      "id": 1,
      "date_created": "2021-11-08T17:12:03Z",
      "date_updated": "2021-11-22T16:08:55Z",
      "first_name": "John",
      "last_name": "Doe",
      "email": "[email protected]",
      "phone": "9876543210",
      "dob": "1980-01-01",
      "password": "xxxxxxxxx",
      "plan_start": "2021-11-22T16:07:46Z",
      "plan_expiry": "2021-12-21T16:06:25Z"
    }
  ]
}

I want to parse the JSON to display the email field value in the textbox.

In my livecode stack:

1. The button is named as "getdata"
2. The textbox is named as "flddata"

In the button script, I've added the following code:

   put "<api url endpoint>" into tUrl
   put "Authorization: Bearer xxxxxxxxx" into tHeaders
   put tsNetGetSync(tUrl, tHeaders, tRecvHeaders, tResult, tBytes) into tData
   put JSONToArray(tData) into tDataArray
   put tDataArray["email"] into field "flddata"

But this doesn't work. Nothing happens. For the life of me, I can't figure out what's wrong. Any help would be appreciated. Thanks a ton!

Answer 1

To access the "email" key of the array that is built from the JSON you shared. You must first access the "data" key and then key 1. So the last line of your code would be as follows:

put tDataArray ["data"] [1] ["email"] into field "flddata"

Tips: Put a break point on that line. This will allow you to see the contents of the variables so that you can see the structure of the array.

Answer 2

It looks like it might be a multidimensional array. Here's a simple way to get a look at how it's structured:

1. Drag a Tree View widget onto your card.

2. Set the arrayData property of the widget to your array tDataArray. Like this:

   set the arrayData of widget "Tree View" to tDataArray

You should see the structure of the array in your tree view widget. It's possible that the array that was created looks something like this:

put tDataArray[1]["email"] into field "flddata"