Error using jQuery UI Selectmenu plugin in IE

Question

The jQuery UI Selectmenu plugin, demoed here: http://jquery-ui.googlecode.com/svn/branches/labs/selectmenu/index.html

I am having a couple of problems with this plugin. I'll focus on just one that only happens in IE.

I have html:

<label for="SearchState"></label>
<select style="width: 160px" name="SearchState" id="SearchState">
   <option>CT</option>
   <option>MA</option>
   <option>NH</option>
</select>

and jQuery:

$('select#SearchState').selectmenu();

In Firefox this works, however in IE I get error on load:

"Invalid argument" - jquery 1.4.2 Line: 4618

However the new styled selectmenu appears along with the original one (this is by design, but the original html select menu should be hidden), but when I click an option I get several of these errors:

"this._optionList" is null or not an object - ui.selectmenu.js Line 400

Any ideas why this does not work in IE?

Lines 399-401 of ui.selectmenu.js

_selectedOptionLi: function() {
    return this._optionLis.eq(this._selectedIndex());
},

Lines 4615-4622 of jquery-1.4.1.js

name = name.replace(rdashAlpha, fcamelCase);

if ( set ) {
    style[ name ] = value;
}

return style[ name ];

Answer 1

I confirmed this behavior. I recreated it in this jsfiddle . After upgrading jQuery to 1.7.2, it did not give these errors. In this jsfiddle is the fixed version. Note that I also upgraded jQuery UI (because of jsFiddle) to jQuery UI 1.8.18, but the problems lie in the version of jQuery you are using. I recommend updating to the most recent (stable) version of jQuery and jQuery UI , and selectmenu ( JavaScript and CSS ).

Answer 2

You are using an old jQuery UI labs plugin and it looks like it hasn't been worked on in a while.

Take a look at this fork on github https://github.com/fnagel/jquery-ui .

A fork of jQuery UI to push development of some plug-ins. Currently you will find: the latest version of Selectmenu (originally by filament group) and a accessible version of jQuery UI Tabs. Please check branch selectmenu and tabs-accessibility

Answer 3

If the demo you linked to works in IE, as a first step I would try using the same version of selectmenu that the demo is . If this works, you know it is a problem with the plugin.