This article aims to show how to create 3 dropdownlists to display countries, states and cities. When you select a country in the countries dropdownlist, the states dropdownlist will fetch the related states for that country. Then when you select a state, the cities dropdownlist will fetch the related cities for that state.
Using the Code
This article assumes that you are familiar with basic HTML as well as basic ASP.NET code. The code in this article is actually custom made to use the World Major Cities data from GeoDataSource.com. That said, it is still quite straightforward to modify the code to work with data from other sources. I have included a sample of the data file in the text file GEODATASOURCE-WORLD-MAJOR-CITIES-SAMPLES.TXT and to make life easier for you, I have also included 2 SQL scripts for importing into either a MySQL database or a Microsoft SQL Server database. For MySQL, the script filename is called countrystatecity-mysql-sample.sql. For Microsoft SQL Server, the file is called countrystatecity-mssql-sample.sql.
In this example, the 2 important files are index.aspx which contains the HTML code and the index.aspx.vb which contains the .NET code which does all the real work. The code is meant to work in Microsoft Visual Studio 2003.
Let's start off with the index.aspx file which is displayed below:
It is a fairly simple HTML file containing 3 ASP.NET dropdownlists. Note that both the countries and states dropdownlists have
AutoPostBack="True". This is because the moment you select a value in either of the dropdownlists, the page will reload to get new values for the next dropdownlist.