1. Home
  2. Tutorials
  3. Working with APIs
  4. Display Dynamic Content in a Table

Display Dynamic Content in a Table

In Dropsource you can display data from an array in an API response using dynamic Elements, such as Tables. This allows you to create page designs that will populate with the required number of display Elements when the API response is received. With the API request added to your page:

  1. Add a Table Element to the page.
  2. In Properties, select Dynamic from the Content/Type drop-down list.

    dynamic tablepage controller dynamicview pager dynamic

  3. Add a Table Cell inside the Table (drop it on top of the Table).
  4. Add Elements inside the Table Cell to display the fields inside the API response array (e.g. Text Views, Labels).
  5. Open your request and select the Responses section.
  6. Arrays will be listed as Data Sources – find the Data Source you want to display and bind it to the Table (click and drag it onto the Table on the Canvas, or click it and select the Table from the Elements container).

    bind data sourceview pager bindpage controller bindcard deck bindcollection view bindcard swipe bind

  7. Fields inside the array will be nested under the Data Source – bind the fields you want to display, to the Elements you added inside the Table Cell (click and drag them onto the Elements on the Canvas, or click them and select from the Elements container).

    bind array fieldpager controller fieldview pager fieldcard deck fieldcollection view fieldcard swipe child bind

If your array includes image URLs you want to display, you will need to use the Table Cell Loaded Event. Events on the Table Cell can access the data from the array entry bound to it. You can also iterate through the array if you need to carry out processing on it.

Was this article helpful to you? Yes No

How can we help?