Something like this perhaps?
<html>
<head>
<title>Countries & Cities</title>
<script type='text/javascript'>
function field( id ) {
var ele = document.getElementById( id );
if ( !ele ) {
alert( 'Specified element not found. id="' + id + '"' );
}
return ele;
}
function indexOf( obj, val ) {
for ( var i = obj.length - 1; i > -1; i-- ) {
if ( obj[ i ] == val ) {
break;
}
}
return i;
}
var data = {
'Uno' : '1A,1B'.split( ',' ),
'Dos' : '2A,2B,2C,2D'.split( ',' ),
'Tres' : '3A,3B,3C'.split( ',' )
};
function populate() {
var countries = field( 'countries' );
var cities = field( 'cities' );
if ( countries && cities ) {
for ( var p in data ) {
countries.options[ countries.options.length++ ] = new Option( p );
}
}
}
function filter() {
var countries = field( 'countries' );
var cities = field( 'cities' );
if ( countries && cities ) {
for ( var i = 0; i < countries.options.length; i++ ) {
if ( countries.options[ i ].selected ) {
var val = countries.options[ i ].value || countries.options[ i ].text;
if ( val in data ) {
for ( var j = 0; j < data[ val ].length; j++ ) {
cities.options[ cities.options.length++ ] = new Option( data[ val ][ j ] );
}
}
}
}
}
}
function Clear( id ) {
var sel = field( id );
if ( sel && ( sel.nodeName == 'SELECT' ) ) {
sel.options.length = 0;
}
}
</script>
</head>
<body onload='populate()'>
Countries: (pick 1 or more)<br>
<select id='countries' onfocus='Clear("cities")' multiple></select><br>
<select id='cities'></select><br>
<input type='button' value='Filter' onclick='filter()'>
</body>
</html>
1: 2: 3: 4: 5: 6: 7: 8: 9: 10: 11: 12: 13: 14: 15: 16: 17: 18: 19: 20: 21: 22: 23: 24: 25: 26: 27: 28: 29: 30: 31: 32: 33: 34: 35: 36: 37: 38: 39: 40: 41: 42: 43: 44: 45: 46: 47: 48: 49: 50: 51: 52: 53: 54: 55: 56: 57: 58: 59: 60: 61: 62: 63: 64: 65: 66: 67: 68: 69:
by: nazzie303Posted on 2009-08-20 at 08:57:33ID: 25144100
Is it better than to do it with vbscript than the javascript ?