Created
May 29, 2014 09:25
-
-
Save SalocinDotTEN/ebee2d1532944d9793c5 to your computer and use it in GitHub Desktop.
Javascript to associate a dropdown select menu of Malaysian states with their districts and cities based on the "id" attribute. How to use? print_city("id" tag of select, this.value); similar for state_short_print_city();
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Based on http://www.2my4edge.com/2013/06/choose-state-and-city-based-on-country.html | |
// Done for a client project but now open sourced under Creative Commons. http://creativecommons.org/licenses/by-sa/4.0/ | |
// District lists | |
var districts = new Array(); | |
districts[''] = ""; | |
districts['Johor'] = "Batu Pahat|Johor Bahru|Kluang|Kota Tinggi|Mersing|Muar|Pontian|Segamat|Kulaijaya|Ledang"; | |
districts['Kedah'] = "Baling|Bandar Baharu|Kota Setar|Kuala Muda|Kubang Pasu|Kulim|Pulau Langkawi|Padang Terap|Pendang|Pokok Sena|Sik|Yan"; | |
districts['Kelantan'] = "Bachok|Gua Musang|Jeli|Kota Baharu|Kuala Krai|Machang|Pasir Mas|Pasir Puteh|Tanah Merah|Tumpat"; | |
districts['Kuala Lumpur'] = "Kuala Lumpur"; | |
districts['Melaka'] = "Alor Gajah|Melaka Tengah|Jasin"; | |
districts['Negeri Sembilan'] = "Jelebu|Jempol|Kuala Pilah|Port Dickson|Rembau|Seremban|Tampin"; | |
districts['Pahang'] = "Bentong|Bera|Cameron Highlands|Jerantut|Kuantan|Lipis|Maran|Pekan|Raub|Rompin|Temerloh"; | |
districts['Pulau Pinang'] = "Penang Timur Laut|Penang Barat Daya|Seberang Perai Utara|Seberang Perai Tengah|Seberang Perai Selatan"; | |
districts['Perak'] = "Batang Padang|Hilir Perak|Hulu Perak|Kerian|Kinta|Kuala Kangsar|Larut, Matang|Selama|Manjung|Perak Tengah"; | |
districts['Perlis'] = "Perlis"; | |
districts['Sabah'] = "Interior Division|Kudat|Sandakan|Tawau|West Coast|Labuan"; | |
districts['Sarawak'] = "Betong|Bintulu|Kapit|Kuching|Limbang|Miri|Mukah|Samarahan|Sarikei|Sibu|Sri Aman"; | |
districts['Selangor'] = "Gombak|Hulu Langat|Hulu Selangor|Klang|Kuala Langat|Kuala Selangor|Petaling|Sabak Bernam|Sepang/Putrajaya"; | |
districts['Terengganu'] = "Besut|Dungun|Hulu Terengganu|Kemaman|Kuala Terengganu|Marang|Setiu"; | |
// City lists | |
var cities = new Array(); | |
cities[''] = ""; | |
cities['Johor'] = "Batu Pahat|Johor Bahru|Kluang|Kota Tinggi|Kulai/Kulaijaya|Ledang|Muar|Mersing|Nusajaya|Pasir Gudang|Pontian|Segamat"; | |
cities['Kedah'] = "Alor Setar|Baling|Jitra|Kuala Kedah|Kulim|Langkawi|Pendang|Pokok Sena|Sungai Petani|Sik|Yan"; | |
cities['Kelantan'] = "Kota Bharu|Pasir Mas|Tumpat|Pasir Puteh|Bachok|Kuala Krai|Machang|Tanah Merah|Jeli|Gua Musang"; | |
cities['Kuala Lumpur'] = "Kuala Lumpur"; | |
cities['Melaka'] = "Alor Gajah|Bandaraya Melaka|Jasin"; | |
cities['Negeri Sembilan'] = "Jelebu|Jempol|Kuala Pilah|Nilai|Port Dickson|Rembau|Seremban|Seremban 2|Tampin"; | |
cities['Pahang'] = "Bandar Bera|Bentong|Cameron Highlands|Fraser\'s Hill|Genting Highlands|Jerantut|Kuantan|Kuala Lipis|Kuala Rompin|Maran|Pekan|Raub|Temerloh"; | |
cities['Perak'] = "Batu Gajah|Gerik|Ipoh|Kampar|Kuala Kangsar|Parit Buntar|Seri Iskandar|Seri Manjung|Sitiawan|Tanjung Malim|Tapah|Teluk Intan|Taiping"; | |
cities['Perlis'] = "Arau|Beseri|Chuping|Kaki Bukit|Kangar|Kuala Perlis|Mata Ayer|Padang Besar|Sanglang|Simpang Empat|Wang Kelian"; | |
cities['Pulau Pinang'] = "Balik Pulau|Bukit Mertajam|Kepala Batas|Sg Jawi|Georgetown"; | |
cities['Sabah'] = "Keningau|Kota Kinabalu|Sandakan|Kudat|Tawau|Labuan"; | |
cities['Sarawak'] = "Betong|Bintulu|Kapit|Kuching|Labuan|Limbang|Miri|Mukah|Samarahan|Sarikie|Sibu|Sri Aman"; | |
cities['Selangor'] = "Ampang|Banting|Bangi|Cheras|Kajang|Klang/Port Klang|Kuala Kubu Bharu/Hulu Selangor|Kuala Selangor|Petaling Jaya|Rawang|Sabak Bernam|Selayang|Sepang/Putrajaya|Seri Kembangan|Shah Alam|Subang Jaya"; | |
cities['Terengganu'] = "Jerteh/Kg Raja|Kuala Dungun|Kuala Berang|Kemaman/Chukai|Kuala Nerus|Kuala Terengganu|Marang|Bandar Permaisuri"; | |
function print_city(eleID, selectedIndex){ | |
var option_str = document.getElementById(eleID); | |
option_str.length=0; // Fixed by Julian Woods | |
option_str.options[0] = new Option('-- Select City --',''); | |
option_str.selectedIndex = 0; | |
var city_arr = cities[selectedIndex].split("|"); | |
for (var i=0; i<city_arr.length; i++) { | |
option_str.options[option_str.length] = new Option(city_arr[i],city_arr[i]); | |
} | |
} | |
//This is for those features who have short forms as states. | |
function state_short_print_city(selectID, selectInd) { | |
var stateShort = new Array(); | |
stateShort['-1'] = ""; | |
stateShort['KL'] = "Kuala Lumpur"; | |
stateShort['JH'] = "Johor"; | |
stateShort['KH'] = "Kedah"; | |
stateShort['KN'] = "Kelantan"; | |
stateShort['LB'] = "Labuan"; | |
stateShort['ME'] = "Melaka"; | |
stateShort['NS'] = "Negeri Sembilan"; | |
stateShort['PG'] = "Penang"; | |
stateShort['PH'] = "Pahang"; | |
stateShort['PK'] = "Perak"; | |
stateShort['PL'] = "Perlis"; | |
stateShort['PY'] = "Putrajaya"; | |
stateShort['SA'] = "Sabah"; | |
stateShort['SK'] = "Sarawak"; | |
stateShort['SL'] = "Selangor"; | |
stateShort['TE'] = "Terengganu"; | |
print_city(selectID, stateShort[selectInd]); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment