Create a country code drop down

I’m trying to build a drop down with list of country name and their country code, so I want something that will display the country name and their country code when you click on the drop down menu but when you click on a particular country, it should only show the country code.

1 Like

Could somehow make a CSV of this List of country codes by alpha-2, alpha-3 code (ISO 3166)

and upload it as a new data type “County” with a field for the name and country code. Then your dropdown would just be a search for all countries

2 Likes

I actually saved all the country names and code in my bubble database. I also did search for countries but I want a scenario whereby when I click the country name and code , it will show the country code as the value

Maybe just make your own dropdown with a repeating group and a workflow to set a state? Then you can have the design you want and have it show only the country code when clicked

1 Like

Thank you.

But can you like show me screenshots of how you’re gonna do this ?

This is super barebones but is this what you’re looking for?

editor (the countries page)

Exactly what I wanted …

Thank you so much…
I’ll implement it in my app

1 Like

Yep, when in doubt just make it from scratch :joy:

Seems how to use custom state is very helpful

Why dont you use an api, for it, there be a free api we can use for all countries and there code

Yeah sure…

Could you please help me on another problem??.

What is it

Thank you so much Tyler. I’ve been able to implement that in my app. Another thing I wanna do is something like pagination. I mean when you have a single post page and I would love to create something like a previous and next to switch to the next or previous page directly.

So if you’re talking about paginating a repeating group, if you set a fixed # of rows it automatically has pages. You then add buttons with actions to go to next page, prev page. And it exposes states of the repeating group like Total # of pages, Current page #, etc.

Unless you’re talking about next and previous to jump between next/previous Things?

1 Like

Exactly…

Talking about next and prev to jump between next and previous posts


Something like that

What would determine the order of the posts, would you do creation date?

Here’s what you would do for the workflow on your “Next” button

On the “Previous” button it’s the same workflow but the constraint sign is < instead, and it’s :first item instead of :last item

Then on your Previous button to indicate there’s no more posts to see you would put the conditional:


And for the Next button flip the sign again to >

You might need to switch the buttons around depending on if you want Next to go to a newer one or older one but that’s the basic concept

1 Like

Thank you so much Tyler …

I’ll try that

For that custom drop-down, the layout is kind of breaking anytime I place the country and code repeating group under it…

Is there something like position absolute that will enable me to be able to move it around anyhow without actually breaking my layout?

It’s a text input, then the repeating group is in a GroupFocus so when it is shown it appears over your existing elements, it doesn’t push anything down

The groupfocus you then pick the searchbox as it’s reference element

1 Like