OnChange never starts for <select> in Internet Explorer

Question

I use jQuery to bind the event to the onChange handler as follows:

$("#accounts").change(function() { DoSomething(); }); 

The problem I encountered is that although everything works fine in Firefox, the event never fires in IE. I know that IE handles the onChange event differently than Firefox, as mentioned here among other places. However, I do not think that this is a problem in this case, since the event never fires even when clicking on other elements on the screen.

Just to make sure there was no problem with my jQuery code, I tried to inject the onChange inline event as follows:

 <select id="accounts" onChange="DoSomething();"> <option value="1">Account 1</option> <option value="2">Account 2</option> {omitted remaining 3000 options of list for brevity} </select> 

but the event still did not fire, even if it was implemented that way.

Currently, I have changed the code to use the onClick event, since the page has low traffic and the function being called is quite inexpensive. However, I would like to find out what the problem is, as I am sure that in the future I will face it again.

Answer 1

This is sometimes when your markup is not correctly wrapped in an html hierarchy. This may be the reason it may have happened to me, and as soon as I corrected the markup, it worked perfectly.

Answer 2

This can be solved by placing a DoSomething call from another thread, using it as the code to execute in setTimeout when you use the IE browser.

 if (jQuery.browser.msie) { setTimeout(DoSomething, 0); } else { DoSomething(); } 

According to Microsoft, this may be due to the race condition that is occurring. Please let us know if this works for you.