IE8 Trouble Continued...Hangs on Dropdown Selection

The trouble seems to continue. In one of our apps, when clicking on a dropdown list, IE8 hang up completely. I quickly searched for similar problems and apparently IE has its issues with dropdowns. Anyway, here's a quick guide to a fix that worked for me.

After I got notified by one of our clients, I setup a virtual machine with XP and IE8 installed and indeed, I was able to successfully reproduce the odd behavior. Basically when opening the dropdown and selecting an entry the browser completely blocked.
(Note the "Windows Internet Explorer (Not Respnding)" in the title bar)

..and about a couple of minutes later

IE9, Chrome and Firefox obviously worked just perfectly. I searched in the codebase for any interactions with the dropdown and found this event listener:

".nationList change": function (el, ev) {
    // current nation id
    var nationId = el.context.selectedOptions[0].value;

    //snip snip snip
}

One of our devs used the highlighted line to extract the currently selected dropdown option. It's a rather complicated approach, but not wrong at all, at least it worked on the other browsers. The line seemed suspect to me and so I changed it to the much simpler jQuery alternative...

...
var nationId = $(el).val();
...

...and see there, everything worked as expected and also IE8 didn't hang no longer. Don't ask me why this happened, but it seems to work now.

---

Questions? Thoughts? Hit me up on Twitter