Tom's Guide | Tom's Hardware | Tom's Games
![]() |
![]() |
![]() |
hi,
in my code country-state-city are in list boxes,where after selecting state name,city list must be generated dynamically and only those cities of respected state should come in city list box. How to do it in javascript?, If anybody should help me,please...Viveka

Here's an example I have:
<html>
<head><script type="text/javascript">
// State lists
var states = new Array();//Canada States
states[0] = new Array('Alberta','British Columbia','Ontario');
//Mexico States
states[1] = new Array('Baja California','Chihuahua','Jalisco');
//US States
states[2] = new Array('California','Florida','New York');
// City lists
var cities = new Array();
cities[0] = new Array();
cities[0][0] = new Array('Edmonton','Calgary');
cities[0][1] = new Array('Victoria','Vancouver');
cities[0][2] = new Array('Toronto','Hamilton');cities[1] = new Array();
cities[1][0] = new Array('Tijauna','Mexicali');
cities[1][1] = new Array('Ciudad Juárez','Chihuahua');
cities[1][2] = new Array('Guadalajara','Chapala');cities[2] = new Array();
cities[2][0] = new Array('Los Angeles','San Francisco');
cities[2][1] = new Array('Miami','Orlando');
cities[2][2] = new Array('Buffalo','new York');
function setStates(){cntrySel = document.getElementById('country');
stateSel = document.getElementById('state');
stateList = states[cntrySel.selectedIndex];changeSelect(stateSel, stateList);
setCities();}
function setCities(){
cntrySel = document.getElementById('country');
stateSel = document.getElementById('state');
citySel = document.getElementById('city');
cityList = cities[cntrySel.selectedIndex][stateSel.selectedIndex];changeSelect(citySel, cityList);
}
function changeSelect(field, arrayVals) {
field.options.length = 0;
for (i=0; i<arrayVals.length; i++) {
field.options[field.length] = new Option(arrayVals[i],arrayVals[i]);
}
}</script>
</head>
<body onload="setStates();">
<form name="test" method="POST" action="processingpage.php">Country:
<select name="country" id="country" onchange="setStates();">
<option value="Canada">Canada</option>
<option value="Mexico">Mexico</option>
<option value="United States">United States</option>
</select>State:
<select name="state" id="state" onchange="setCities();">
<option value="">Please select a Country</option>
</select>City:
<select name="city" id="city">
<option value="">Please select a Country</option>
</select>
</form>
</body>
</html>Michael J

Well Ofcourse I don't have a solution to your query but still may be you shall like my suggestion that its good if you should visit the site of very popular Web Designing Company- www.webdesigningcompany.net
You will found the lot more easiest ways to design the specific set of websites.
Also various articles regarding web designing will certainly help you better.
wwwwwww

![]() |
![]() |
![]() |

This post is quite old and has been locked from receiving new replies. Please create a new posting instead.
| Ads by Google |