How to dynamically load a list of cities when selecting a country select?

Question

JavaScript

Hey! I'm trying to write a registration on the site, I have two selects, initially in one there should be a list of countries, and in the second a list of cities that will appear when choosing a country. Initially, the second select is in the disabled state, where can I get an array of cities, and how to bind it more correctly? Thank you!

Answer 1

where can i get an array of cities

Initially, I think, on the Internet, for example here . After that, you can save them either in one big-big JSON, or leave them in the database and get them from there.
Further, the algorithm looks something like this:
1. The user selects a country, the ID of the country selected in the select is sent to the server (GET or POST request)
2. The server returns a list of regions / cities of the selected country, presumably in JSON format
3. The resulting list is parsed on ID = Value that fills the second select
You can also pre-fill the second select with all possible cities and then hide the extra ones, but I would not do this, since there will be a lot of data and this page will also load, not very fast. ..