I have a web page that shows content based upon the selections of a multi select combo box. All seems to work fine under IE 7, but under IE 6 you seem to have do click multiple times to get the correct result. When I select a state from the combo box, a corresponding table row should be displayed, select again and it should be hidden. Multiple selections should show multiple rows.
The following code illustrates the problem:
<html>
<head>
<script language="javascript" >
function fShowRow(sObjName, bShow){
//alert('show')
document.getElementById("t
r" + sObjName).style.display= (bShow) ?"block":"none"}
function fShow(obj){
var oObj = obj;
for (i=0;i<obj.length;i++)
{if (obj.options[i].value != "")
{if (obj.options[i].selected)
{fShowRow(obj.options[i].v
alue,true)
;}
else
{fShowRow(obj.options[i].v
alue,false
)}
}
else
{fShowRow(obj.options[i].v
alue,false
)}
}
}
</script>
</head>
<body>
<table border="1">
<tr>
<td valign="top">
<p align="center">State<br>
<SELECT size="3" id="frmLicState" size="1" multiple onclick="fShow(document.ge
tElementBy
Id('frmLic
State'));"
>
<OPTION value='' SELECTED>None</OPTION>
<OPTION value='01'>NJ</OPTION>
<OPTION value='03'>NY</OPTION>
</SELECT>
</td>
<td valign="top">
<table border="0" cellspacing="0">
<tr style="display:block;"><td
valign="bottom">State</td>
</tr>
<tr id='tr' style='display:none;' licstateid='' ><td >None</td></tr>
<tr id='tr01' style='display:none;' licstateid='01'><td >NJ</td></tr>
<tr id='tr03' style='display:none;' licstateid='03'><td >NY</td></tr>
</table>
</td>
</tr>
</table>
</body>
</html>
Copy and paste and view in your browser. The funny thing is, if you uncomment the "alert" code it works fine under both(?) but of course, you can't have that alert box poping up all the time.
This is for a client web site, so a resolution is critical. Please help, I'm at wits end.
Start Free Trial
