Issues with dynamic select lists in IE7 1

[JesseGifford]

I have a select list dynamically populated by a SQL Server database.

I want to select all items in the list when a particular item is chosen. The code I've written works great in Firefox and I'm assuming other browsers as well. It just doesn't work in IE and specifically tested not working in IE7.

Any ideas on what I can do to make this work in IE7?

Here is the code I'm using:

Select List:

<select name="Literature_MarketID" class="requiredfield" size="13" id="marketList" multiple>
        <option selected="selected" value="">=== Control-click to select multiple items ===</option>
            <%
While (NOT rsMarkets.EOF)
%>
            <option value="<%=(rsMarkets.Fields.Item("Markets_ID").Value)%>" id="marketOption_<%=(rsMarkets.Fields.Item("Markets_ID").Value)%>" onClick="checkAll();"><%=(rsMarkets.Fields.Item("Markets_Description").Value)%></option>
            <%
  rsMarkets.MoveNext()
Wend
If (rsMarkets.CursorType > 0) Then
  rsMarkets.MoveFirst
Else
  rsMarkets.Requery
End If
%>
          </select>

Javascript used to select all options when "All" is chosen from the list:

<script language="JavaScript" type="text/JavaScript">
<!--
function checkAll()
{
	var allMarkets = document.getElementById("marketOption_13");

			if (allMarkets.selected == true)
			{
				if (document.getElementById('marketList') != null)
				{
					var o = document.getElementById('marketList');
					for (var i = o.length - 1; i > 0; --i)
					{
							o.options[i].selected = true;
					}
				}	
			}
}
//-->
</script>

 

[tsuji]

[1] Scripting onclick event on option element is shaky. Use onchange instead on the select element instead.
[tt]
<select name="Literature_MarketID" class="requiredfield" size="13" id="marketList" multiple [blue]onchange="checkAll()"[/blue]>
<option selected="selected" value="">=== Control-click to select multiple items ===</option>
<%
While (NOT rsMarkets.EOF)
%>
[blue]<option value="<%=(rsMarkets.Fields.Item("Markets_ID").Value)%>" id="marketOption_<%=(rsMarkets.Fields.Item("Markets_ID").Value)%>">[/blue]<%=(rsMarkets.Fields.Item("Markets_Description").Value)%></option>
<%
rsMarkets.MoveNext()
Wend
If (rsMarkets.CursorType > 0) Then
rsMarkets.MoveFirst
Else
rsMarkets.Requery
End If
%>
</select>
[/tt]
[2] The checkAll() is fine. But as a matter of detail, logical, there should be more need to check the existence of marketOption_13, a very hard scripted id, more than the existence of the select element with the id marketList! Hence, it seems more reasonable to have it like this.
[tt]
function checkAll()
{
var allMarkets = document.getElementById("marketOption_13");
if (allMarkets && allMarkets.selected)
{
var o = document.getElementById('marketList');
if (o)
{
for (var i = o.length - 1; i > 0; --i)
{
o.options.selected = true;
}
}
}
}
[/tt]

 

[JesseGifford]

That did it. Thanks for the help.