Reference listview item in rest api call url

App Building
,
1

I am creating a list-view component with fields that take data from a REST api call:

listView: [
    container: {
        select: {
            value: "source-key",
        },
        multiselect: {
            datasource: rest_api_call
        }
    },
    ...
]

my api is setup in a way that I need to reference select.value in rest_api_call for each item in listView. I tried defining my REST call url as something like:

.../path/to/resource/listViewState[i].select.value

unfortunately, [i] is not available in the REST call scope. Is there a way to achieve that?

2

By creating a list-view component do you mean using an existing List View Component or creating a custom component yourself?

3

If you have to trigger an API call multiple times, maybe this will help? Run JavaScript | Retool Docs

4

I am using the retool List View component.

your suggestion fulfils half of what I need to happen. How then would I use the return data from each api call to populate the datasource for the multiselect field?

5

If you're looping to execute a number of calls, the result of each api call could be put into a variable, and then your multiselect field will simply load the contents of that variable, which would be an array of objects or whatever your data is.

image
image1884×696 83.3 KB

6

@27shutterclicks thanks!! that was the way to go!

I was having issues because in my api call trigger my additionalScope was being overwritten by another unrelated component so my results were not being stored in the auxiliary state.

for the sake of anyone looking into something similar, here is a run down:

I am building a query builder sort of component with nested ListViews:

query-builder-02
query-builder-022956×1108 77.7 KB

some data formatting constraints and query formatting downstream prevent me from using the builtin retool query-builder component.

When filling these filters, users have to select from a set of values that are stored from a upstream procedure. They select object and property and based on that, the available options for values should change. Arrows indicate dependency.

on the code in retool I have the following:
query-builder-06

  • query is an auxiliary variable that stores the current query to control the structure and length of listviews;
  • apiCallStore is an auxiliary variable that stores the result of my_api_call that I trigger by script, when property or object changes
// my_api_call_trigger query
my_api_call.trigger({
  additionalScope: {
    propName: queryBuilder.data.outerList[ri[0]].innerList[i].property
  },
  onSuccess: data => {
    apiCallStore.setIn([ri[0], i], data)
  },
});

my_api_call calls an internal api:

.../path/to/{{object.value}}/with/{{propName}}/values

I then provide the apiCallStore.value[ri[0]][i] as datastore to the Values select:
image

1 Like