I created a dynamic select list for a website that contains various markets populated by a SQL Server 2000 Database. There was an option in the select list for "All". The client wanted to be able to click on "All" and have it automatically select the remaining markets in the select list.

Here is the code for the select list before having to conform to IE:

        === Control-click to select multiple items ===
        <% While (NOT rsMarkets.EOF) %>
        " id="marketOption_<%=(rsMarkets.Fields.Item("Markets_ID").Value)%>" onclick="checkAll();"><%=(rsMarkets.Fields.Item("Markets_Description").Value)%>
        <%
            rsMarkets.MoveNext()
            Wend
            If (rsMarkets.CursorType > 0) Then
                rsMarkets.MoveFirst
            Else
                rsMarkets.Requery
            End If
        %>

This should have been a simple task. All I had to do was write some Javascript that would watch the select list to see which item was selected. When an item was selected from the list the Javascript would check to see if the option selected was "All". If this was the case then the code would set the remaining items in the list as "selected".

Here is the Javascript code:

As IE is currently the most used browser, I always check how the page renders in it first. To my surprise clicking on "All" did nothing. Next I decided to check Firefox and of course it worked as expected. I checked Safari and it also appeared to be working.

After posting in several Javascript forums I received a solution from a user named tsuji in the Tek-Tips Forum. It turns out that IE does not recognize onclick events for option elements. Instead it requires you to use an onchange on the select element. In my mind it made sense that I would have my code run when the item was selected. It never even crossed my mind that I would want to have my code run when anything in the select list changed. Firefox and even Safari knew what I wanted, but IE didn't.

Here is the select list code after the change to conform to IE:

        === Control-click to select multiple items ===
        <% While (NOT rsMarkets.EOF) %>
        " id="marketOption_<%=(rsMarkets.Fields.Item("Markets_ID").Value)%>"><%=(rsMarkets.Fields.Item("Markets_Description").Value)%>
        <%
            rsMarkets.MoveNext()
            Wend
            If (rsMarkets.CursorType > 0) Then
                rsMarkets.MoveFirst
            Else
                rsMarkets.Requery
            End If
        %>