When your app uses array data from an API, you can allow the user to make selections from the array and build their choices into your functionality. For example, if you are displaying a list of items from an array and the user taps one of them, you can detect which item they selected and build the data from that position in the array into Actions. The example below outlines presenting a list of options and passing the one selected by the user into another page.
- With your API request added to a page in the app, find the array in the Responses – it will be listed as a Data Source. Bind it to a dynamic Elementhelp in your page – the dynamic Element should have a single child Element inside it and any other Elements you need to display the array data.
- Select the childhelp of the dynamic Element and open Properties > Events. Manage the interaction Event, which will depend on the type of Element you’re using, e.g. Tapped for a Cell / Tile.
- Add Actions for the functionality you want to execute based on the user selection. In any Actions you add on the child of the dynamic Element, you can access data from the selected array entry using the Data Source container. For example, to pass a field from the selected item into a second page which has a Page Variable declared in it, use a Go To Page Action and select the relevant field:
Typically you will build the data from the selected array item into further processing, for example in the Places Example App. In Actions on a child Element where the dynamic parent Element is bound to an array, you can access all fields from the array entry, not just fields that are being displayed – you can use this to edit or delete array entries. If you plan on using a Dropdown or Picker Element to provide the user control, the process is a little different. You can alternatively iterate through arrays and build the data from each entry into further processing, optionally carrying out your processing on a set number of items.