Not quite sure how to fix it - since the debugger in IE leaves a little to be desired.
This code works in IE8 - don't have 7 to test with.
<!DOCTYPE html>
<html>
<head>
<script>
function byId(e) {return document.getElementById(e);}
function stateComboChange()
{
var combo1 = byId('stateCombo');
var combo2 = byId('cityCombo');
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>