Before I start, I'm going to echo that which Christian said earlier. It's not very 'urjent' to
us at all. This has been combined with a 'thanks in advance' - which may be interpreted by some as an indication that any effort will not be acknowledged after the fact.
For me, the last two sentences of your question spoiled what would otherwise be a-ok. "it's very urjent. Thanks in advance"
Anyway, this isn't terribly difficult. Visit
http://www.w3schools.com/js/default.asp[
^] often, consider it roughly equivalent to MSDN for all things web-related, though admittedly it's not as comprehensive.
. Try the following:
<!DOCTYPE html>
<html>
<head>
<script>
function byId(e) {return document.getElementById(e);}
function stateComboChange()
{
var combo1 = byId('stateCombo');
var combo2 = byId('cityCombo');
// alert(combo1.value);
emptyCombo(combo2);
switch(combo1.value)
{
case '-1': addOption(combo2, -1, '-select state first-');
break;
case '0': addOption(combo2, 0, 'Melbourne');
addOption(combo2, 1, 'Horsham');
break;
case '1': addOption(combo2, 2, 'Sydney');
addOption(combo2, 3, 'Bondi');
break;
case '2': addOption(combo2, 4, 'Hobart');
addOption(combo2, 5, 'Port Arthur');
break;
}
cityComboChange();
}
function cityComboChange()
{
var combo2, tgt;
combo2 = byId('cityCombo');
tgt = byId('tgt');
tgt.innerHTML = combo2.options[combo2.options.selectedIndex].title;
}
function emptyCombo(e)
{
e.innerHTML = '';
}
function addOption(combo, val, txt)
{
var option = document.createElement('option');
option.value = val;
option.title = txt;
option.appendChild(document.createTextNode(txt));
combo.appendChild(option);
}
</script>
</head>
<body>
<select id='stateCombo' onchange='stateComboChange();'>
<option value='-1' title='-select one-'>-select one-</option>
<option value='0' title='Vic'>Vic</option>
<option value='1' title='Nsw'>Nsw</option>
<option value='2' title='Tas'>Tas</option>
</select>
<select id='cityCombo' onchange='cityComboChange();'>
<option value='-1' title='-select state first-'>-select state first-</option>
</select>
<div id='tgt'></div>
</body>
</html>
Edited to add display of city list selected item's text.
Submit an article or tip