Country / city drop down menu in html and javascript

Is there any snippet available that contains all countries, states, and cities to display in the html drop-down list for selection?

What is the standard for this? Is everyone rolling away?

The snippet can be in html, javascript, jquery plugin.

NOTE. I know how to make a chained drop down menu. I'm more interested in data, not technology.

+7
source share
5 answers

Here is the data for free - good luck getting 33 MB presented in the drop-down list;)

They also seem to have a JavaScript API - (found through the Best way to get the closest city? Python / Django ) to start with the user's location (IP)

In the foreseeable future there may be a JSON interface in accordance with Peter Sachkovsky Operation Manager | Maxmind, Inc .:

Yes, we are really considering the possibility of switching to JSON, but we do not have a timeline for when this will happen. If / when this happens, we will have updates on our newsletter and website.

Disclaimer I am not affiliated with MaxMind, and they themselves also offer to see GeoNames


Cities of the world with population MaxMind Last updated: May 17, 2011

Product Summary: includes city, region, country, latitude and longitude. This product does not contain IP addresses. This is just a list of all the cities in the world. For IP address mappings, see our MaxMind City product.

Please note that this product is now a free download [33 MB]. The database will be updated approximately once a year, as city data do not change frequently. [License]

The database uses toponymic information based on geographical names. The database contains official official names approved by the Council of States for Geographical Names and is supported by the National Geospatial Intelligence Agency. Further information is available on Map and Location Links at www.nga.mil. The Geospatial Intelligence Agency's National Name, Initials, and Seal are protected by United States Code 10 445.

He also uses free population data © by Stefan Helders www.world-gazetteer.com. Visit his website to download demographic data for free. Our database combines Stefan population data with a list of all cities in the world.

Another free city database is available from GeoNames.

Product Features - MaxMind Cities with a Population

Includes the following fields: Country Code ASCII City Name City Name State/Region Population Latitude Longitude Timezone data is available through an external lookup Approximately 2,710,000 records. Database Fields Field Data Type Field Description Country Code char(2) ISO 3166 Country Code, ASCII City Name varchar(100) Name of city or town in ASCII encoding City Name varchar(255) Name of city or town in ISO-8859-1 encoding. A list of cities contained in GeoIP City is available. State/Region char(2) For US, ISO-3166-2 code for the state/province name. Outside of the US, FIPS 10-4 code Population unsigned int Population of city (available for over 33,000 major cities only) Latitude numeric (float) Latitude of city where IP is located Longitude numeric (float) Longitude of city where IP is located 
+6
source

Any code containing all this data will be much larger than a fragment. I do not think that you will find a standard component for this, and I would not trust anyone for which I found this claim. There is too much subjectivity, and also make up your own judgments about how determined you are.

  • Such data is constantly changing and in many cases is not harmonized around the world . I see you are from Pakistan; Which country should Kashmir be listed in? See Also: Burma (or do I mean Myanmar?)
  • Not everything fits perfectly with city / state / country classes. Should Puerto Rico be listed as a country or state in the USA? Then you have Crown dependencies, remote territories, protectorates, self-governing colonies, etc. .
  • Compiling a complete list of states (more generally, Subnational organizations , including territories, districts, provinces, prefectures, and more) and especially the "strong" cities (do you really want to include Lost Springs, Wyoming, population: 1?) Will be quite an achievement. I am not sure that even the CIA World Factbook is comprehensive.

Some other good sources when you ride on your own,

+6
source
+3
source

You can try this code:

 <html> <head> <title>Demo by kishan Radadiya</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ // Countries var country_arr = new Array("Select Country","AUSTRALIA","INDIA","NEW ZEALAND","USA","UAE","MAURITIUS"); $.each(country_arr, function (i, item) { $('#country').append($('<option>', { value: i, text : item, }, '</option>' )); }); // States var s_a = new Array(); s_a[0]="Select State"; s_a[1]="Select State|QUEENSLAND|VICTORIA"; s_a[2]="Select State|ANDHRAPRADESH|KARNATAKA|TAMILNADU|DELHI|GOA|W-BENGAL|GUJARAT|MADHYAPRADESH|MAHARASHTRA|RAJASTHAN"; s_a[3]="Select State|AUCKLAND"; s_a[4]="Select State|NEWJERSEY|ILLINOIS"; s_a[5]="Select State|DUBAI"; s_a[6]="Select State|MAURITIUS"; // Cities var c_a = new Array(); c_a['QUEENSLAND']="BRISBANE"; c_a['VICTORIA']="MELBOURNE"; c_a['ANDHRAPRADESH']="HYDERABAD"; c_a['KARNATAKA']="BANGLORE"; c_a['TAMILNADU']="CHENNAI"; c_a['DELHI']="DELHI"; c_a['GOA']="GOA"; c_a['W-BENGAL']="KOLKATA"; c_a['GUJARAT']="AHMEDABAD1|AHMEDABAD2|AHMEDABAD3|BARODA|BHAVNAGAR|MEHSANA|RAJKOT|SURAT|UNA"; c_a['MADHYAPRADESH']="INDORE"; c_a['MAHARASHTRA']="MUMBAI|PUNE"; c_a['RAJASTHAN']="ABU"; c_a['AUCKLAND']="AUCKLAND"; c_a['NEWJERSEY']="EDISON"; c_a['ILLINOIS']="CHICAGO"; c_a['MAURITIUS']="MAURITIUS"; c_a['DUBAI']="DUBAI"; $('#country').change(function(){ var c = $(this).val(); var state_arr = s_a[c].split("|"); $('#state').empty(); $('#city').empty(); if(c==0){ $('#state').append($('<option>', { value: '0', text: 'Select State', }, '</option>')); }else { $.each(state_arr, function (i, item_state) { $('#state').append($('<option>', { value: item_state, text: item_state, }, '</option>')); }); } $('#city').append($('<option>', { value: '0', text: 'Select City', }, '</option>')); }); $('#state').change(function(){ var s = $(this).val(); if(s=='Select State'){ $('#city').empty(); $('#city').append($('<option>', { value: '0', text: 'Select City', }, '</option>')); } var city_arr = c_a[s].split("|"); $('#city').empty(); $.each(city_arr, function (j, item_city) { $('#city').append($('<option>', { value: item_city, text: item_city, }, '</option>')); }); }); }); </script> </head> <body> <select name="country" id="country"></select> <br> <select name="state" id="state"></select> <br> <select name="city" id="city"></select> </body> </html> 
+1
source

Well, there are many sources on the Internet for such an SQL utility database. (I found that this question solved my problem: https://gist.github.com/ankitnetwork18/4509792 ) The following steps are pretty straight forward. Just download everything through an AJAX request.

-one
source

All Articles