Default api value in dropdown from user's previous selection

[ianruta11]

Hey there! So far using Bubble has been a breeze and my mind is blown by how much it can do . But I just encountered my first major roadblock. I am creating a product that requires users to select data from an external api in a dropdown. For UX reasons, I want to pre-select the user’s previous selection when users returns to view / edit their previous dropdown selections. Right now users, need to always select options for every dropdown with api list data before saving, even if they don’t want to change certain previous inputs.

I had no luck following this solution. My workflow is already setting a state with data from a list api call, and these values are appearing in my dropdown. Whenever I try to set another (non-list) state for the dropdown for the previously saved input, nothing turns blue :(. See below (I know this example is probably not the right way of doing this).

Does anyone have any ideas how I can accomplish this? Thanks!

[dbevan]

What is the data type of the “Previous selection” state?

[ianruta11]

Hey @dbevan! See below:

‘List collection’ is the name of the GET api call. My goal is to preselect a single value that’s in its API response. I am saving the previous selection’s api value id in my db → this id should be in the ‘list collection’ response and I think it could be used as a lookup value.

Many thanks!

[dbevan]

Please do 2 things for me.

1. From the dropdown list (the one in the screenshot you just shared), please open it, and scroll down to the “List collection”. I want to see if there are any other options similar to “List collection”.

2. In the API Connector, go to your GET API call, initialize it, and either screenshot or copy & paste the raw response.

[ianruta11]

[
{
“_id”: "229bb86bec06910e20499,
“lastUpdated”: “2022-12-18T19:21:56.355Z”,
“createdOn”: “2022-05-05T23:28:42.761Z”,
“name”: “Businesses”,
“slug”: “business”,
“singularName”: “Business”
},
{
“_id”: “229bb86bec069135d999”,
“lastUpdated”: “2022-12-18T19:22:03.332Z”,
“createdOn”: “2022-05-10T07:18:17.457Z”,
“name”: “Attributes 4s”,
“slug”: “attribute-4”,
“singularName”: “Attributes 4”
},
{
“_id”: “229bb86bec0691582399”,
“lastUpdated”: “2022-12-16T00:14:36.139Z”,
“createdOn”: “2022-05-26T21:17:26.533Z”,
“name”: “Attribute 3s”,
“slug”: “attribute-3”,
“singularName”: “Attribute 3”
},
{
“_id”: “229bb86bec06915d2699”,
“lastUpdated”: “2022-12-18T19:21:19.672Z”,
“createdOn”: “2022-05-09T04:34:25.457Z”,
“name”: “Cities”,
“slug”: “city”,
“singularName”: “City”
},
{
“_id”: “229bb86bec0691822b4df0d4”,
“lastUpdated”: “2022-12-16T00:14:36.198Z”,
“createdOn”: “2022-07-27T22:08:41.881Z”,
“name”: “Attribute 1s”,
“slug”: “attribute-1”,
“singularName”: “Attribute 1”
},
{
“_id”: “229bb86bec0691884a99”,
“lastUpdated”: “2022-12-18T19:21:26.165Z”,
“createdOn”: “2022-05-10T06:33:36.274Z”,
“name”: “Regions”,
“slug”: “region”,
“singularName”: “Region”
},
{
“_id”: “229bb86bec0691a16299”,
“lastUpdated”: “2022-12-16T00:14:36.161Z”,
“createdOn”: “2022-05-27T22:46:28.625Z”,
“name”: “Attribute 2s”,
“slug”: “attribute-2”,
“singularName”: “Attribute 2”
},
{
“_id”: “229bb86bec0691bd2899”,
“lastUpdated”: “2022-12-18T19:21:42.328Z”,
“createdOn”: “2022-05-16T04:18:29.400Z”,
“name”: “Countries”,
“slug”: “country”,
“singularName”: “Country”
},
{
“_id”: “229bb86bec0691c64799”,
“lastUpdated”: “2022-12-18T19:21:35.141Z”,
“createdOn”: “2022-05-16T04:26:30.498Z”,
“name”: “Neighborhoods”,
“slug”: “neighborhood”,
“singularName”: “Neighborhood”
},
{
“_id”: “229bb86bec0691f22499”,
“lastUpdated”: “2022-12-18T19:22:10.984Z”,
“createdOn”: “2022-07-07T21:33:41.051Z”,
“name”: “Reviews”,
“slug”: “reviews”,
“singularName”: “Review”
}
]

[dbevan]

Thanks for the additional context.

Looking at your workflow (step 3 specifically), your value is “Result of Step 1” where I’m assuming you’re retrieving your list of items from the API call.

Then you have “contains”. Wouldn’t it make more sense to :filter the list (Result of step 1), by the intended item’s “id”?

Then to finish off the expression, add :first item at the end.

It would look something like this:

Result of step 1 (list api collections) :filtered by id :first item

[ianruta11]

Oh man, this worked like a charm! Thanks a million @dbevan !