.change() not triggered in IE 6,7,8 on DropDownList - JQuery

Question

I am trying to bind a change event to a dropdownlist. Works great in chrome and FF but it doesn't fire in IE. I saw a few other posts about this but they were asking about radio buttons and the suggestion was to use .click(), which obviously doesnt work for a DDL.

Does IE6,7,8 not support .change()? What am I doing wrong / whats the best way to fix it? IE8 is the requirement, but itd be nice if it worked in IE7 too.

       $('#<%=DropDownListFriends.ClientID %>').live('change', function() {
            if ($('#<%=DropDownListFriends.ClientID %>').val().length > 0) {
               //DoStuff()
            }
        });

Answer 1

Did you wrap your jQuery statement in a $(document).ready(...) function?

$(document).ready(function()
{
   // Add your change handler binding to here...
   $('#<%=DropDownListFriends.ClientID %>').live('change', function() {
       if ($('#<%=DropDownListFriends.ClientID %>').val().length > 0) {
           //DoStuff()
        }
    });
});

IE may be taking longer to load the page and the page may not be "ready" yet.

Answer 2

onchange on dropdowns is buggy in IE. Personally I switched to .click and that worked for me on a dropdown list. But in the jQuery comments to .change there was a suggestion to use:

$(element).change(function() { doChange(); }).attr("onchange", function() { doChange(); });

or to use .blur

Good luck!

Answer 3

I also encounter that problem... I use $().click instead...

This what i did so that it's doesn't trigger as soon i clicked it..

 $("#dropdown").click(function() {
    if($(this).val() != "")
       // do something
 }

The trigger will be executed if the user really select on the list that has value...

Hope it helps...