This is my dropdownlist for country state and city. My country and state ddl is working
properly but the cities list is not coming properly. Can anyone help please...?
<div><select onchange="print_state('states',this.selectedIndex);" name="country"
id="country"></select>
<script type="text/javascript" language="javascript">
print_country("country");
</script>
</div>
<div>
<select onchange="print_cities('cities',this.selectedIndex);" name="state"
id="states"></select>
<script type="text/javascript" language="javascript">
print_state("states");
</script>
</div>
<div>
<select name="city" id="cities"></select>
<script type="text/javascript" language="javascript">
print_cities("cities");
</script>
</div>
and this is my javascript code
var country_arr = new Array("Afghanistan", "Albania", "Algeria", "American Samoa",
"Angola");
var s_a = new Array();
s_a[0] = "";
s_a[1] = "Badakhshan|Badghis|Baghlan|Balkh|Bamian|Farah|Faryab|Ghazni|Ghowr|
Helmand|Herat|Jowzjan|Kabol|Kandahar|Kapisa|Konar|Kondoz|Laghman|Lowgar|
Nangarhar|Nimruz|Oruzgan|Paktia|Paktika|Parvan|Samangan|Sar-e Pol|Takhar|Vardak|
Zabol";
s_a[2] = "Berat|Bulqize|Delvine|Devoll (Bilisht)|Diber (Peshkopi)|Durres|Elbasan|Fier|
Gjirokaster|Gramsh|Has (Krume)|Kavaje|Kolonje (Erseke)|Korce|Kruje|Kucove|Kukes|
Kurbin|Lezhe|Librazhd|Lushnje|Malesi e Madhe (Koplik)|Mallakaster (Ballsh)|Mat (Burrel)|
Mirdite (Rreshen)|Peqin|Permet|Pogradec|Puke|Sarande|Shkoder|Skrapar (Corovode)|
Tepelene|Tirane (Tirana)|Tirane (Tirana)|Tropoje (Bajram Curri)|Vlore";
s_a[3] = "Adrar|Ain Defla|Ain Temouchent|Alger|Annaba|Batna|Bechar|Bejaia|Biskra|
Blida|Bordj Bou Arreridj|Bouira|Boumerdes|Chlef|Constantine|Djelfa|El Bayadh|El Oued|El
Tarf|Ghardaia|Guelma|Illizi|Jijel|Khenchela|Laghouat|M'Sila|Mascara|Medea|Mila|
Mostaganem|Naama|Oran|Ouargla|Oum el Bouaghi|Relizane|Saida|Setif|Sidi Bel Abbes|
Skikda|Souk Ahras|Tamanghasset|Tebessa|Tiaret|Tindouf|Tipaza|Tissemsilt|Tizi Ouzou|
Tlemcen";
s_a[4] = "Eastern|Manu'a|Rose Island|Swains Island|Western";
var c_a = new Array();
c_a[0] = "";
c_a[1] = "Adoni|Agra|Ahmedabad|Ahmednagar|Ajmer|Akola|Alappuzha/Allepey|Alibaug|
Aligarh|Allahabad|Almora|Alwar|Ambikapur|Amravati|Amritsar|Anand|Ankleshwar|
Asansol|Auli|Aurangabad|Badami|Badrinath|Bagar|Balrampur";
c_a[2] = "2doni|Agra|Ahmedabad|Ahmednagar|Ajmer|Akola|Alappuzha/Allepey|Alibaug|
Aligarh|Allahabad|Almora|Alwar|Ambikapur|Amravati|Amritsar|Anand|Ankleshwar|
Asansol|Auli|Aurangabad|Badami|Badrinath|Bagar|Balrampur";
c_a[3] = "3doni|Agra|Ahmedabad|Ahmednagar|Ajmer|Akola|Alappuzha/Allepey|Alibaug|
Aligarh|Allahabad|Almora|Alwar|Ambikapur|Amravati|Amritsar|Anand|Ankleshwar|
Asansol|Auli|Aurangabad|Badami|Badrinath|Bagar|Balrampur";
c_a[4] = "4doni|Agra|Ahmedabad|Ahmednagar|Ajmer|Akola|Alappuzha/Allepey|Alibaug|
Aligarh|Allahabad|Almora|Alwar|Ambikapur|Amravati|Amritsar|Anand|Ankleshwar|
Asansol|Auli|urangabad|Badami|Badrinath|Bagar|Balrampur";
function print_country(country_id) {
// given the id of the <select> tag as function argument, it inserts <option> tags
var option_str = document.getElementById(country_id);
option_str.length = 0;
option_str.options[0] = new Option('Select Country', '');
option_str.selectedIndex = 0;
for (var i = 0; i < country_arr.length; i++) {
option_str.options[option_str.length] = new Option(country_arr[i], country_arr[i]);
}
}
function print_state(state_id, state_index) {
var option_str = document.getElementById(state_id);
option_str.length = 0; // Fixed by Julian Woods
option_str.options[0] = new Option('Select State', '');
option_str.selectedIndex = 0;
var state_arr = s_a[state_index].split("|");
for (var i = 0; i < state_arr.length; i++) {
option_str.options[option_str.length] = new Option(state_arr[i], state_arr[i]);
}
}
function print_cities(city_id, city_index) {
var option_str = document.getElementById(city_id);
option_str.length = 0; // Fixed by Julian Woods
option_str.options[0] = new Option('Select City', '');
option_str.selectedIndex = 0;
var city_arr = c_a[city_index].split("|");
for (var i = 0; i < city_arr.length; i++) {
option_str.options[option_str.length] = new Option(city_arr[i], city_arr[i]);
}
}
The problem is that my country and state ddl is working properly but the city ddl is not
working properly. The same cities are coming for all of the countries and their states. Can
anyone Help me out please... It would be very much appreciable...