Chosen jQuery widget doesn't work in Compatibility View of IE8

Question

I'm using the Chosen jQuery widget from http://harvesthq.github.com/chosen/. It works well in my application in most browsers but it will not work in IE8 under 'Compatibility View'. This presents a problem for me because on my company's intranet Compatibility View is default for intranet sites. You can test my issue by going to the link above and switching to Compatibility View in IE.

The reason I haven't completely given up on it is because on this page http://davidwalsh.name/dw-content/jquery-chosen.php someone gets it to work in Compatibility View in IE (see for yourself).

I'm using jQuery 1.6.2 and the Chosen 0.9.5. Windows XP and IE 8.0.6001 under Compatibility View. It works fine if I switch the Browser Mode to IE8 in Dev tools but I don't want every user to have to do that. Has anyone used this plugin before and got it to work under Compatibility Mode in IE8?

<script type="text/javascript">    $("#groupsList").data("placeholder", "Select Groups").chosen();</script>

Answer 1

You know something, I came across the exact same issue today.

The version that David Walsh is using doing a demo of is 0.9.1. There's a piece of code in 0.9.5 that completely disables it for MSIE 7 and lower:

  if ($.browser.msie && ($.browser.version === "6.0" || $.browser.version === "7.0")) {
    return this;
  }

I don't exactly know what IE does in compatibility mode - in IE9 with compat mode, at least, doing $.browser.version returns '7.0'. That'll cause this plugin to just exit.

If you really wanted, you could disable that check or apply the code change that someone suggested on this github issue. Alternately, you could just use version 0.9.1 as from David's demo.

Answer 2

I do feel your pain, working for one of those companies, which also has this mode on by default. I had the same problem. instead of forking chosen.js you can set

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

which will tell IE to render the page with its latest renderer, in our case IE8.

Kinda old question, but I hope this helps others.