jQuery UI Autocomplete - style like a standard <SELECT>

Question

I'm on the verge of starting a new web application that is likely to have need for both standard, simple dropdowns as well as more feature-rich autocomplete controls for longer lists of values, better type ahead behavior, etc. I'm planning on using the jQuery UI Autocomplete widget along with some combobox behavior as detailed here:
http://jqueryui.com/demos/autocomplete/#combobox

My concern is that "out of the box" the Autocomplete widget looks very different than a standard control. Since is not easy to skin/style, I'm hoping to adjust the Autocomplete to look & feel as close to the as possible, except in the cases where the increased functionality justifies a different L&F.

What is the best way to go about reskinning the Autocomplete to look more like a ? Has this already been done somewhere? Should I use jQuery UI theming? Other options?

Answer 1

The autocomplete control already uses the jQuery UI theming :)

Change the style with the dropdown in the upper right of that page you linked here to see.

Those are the default themes available. but you can of course tweak the theme yourself. All jQuery UI widgets conform to this theming scheme. They provide a tool you can customize the theme with as well, called ThemeRoller. You'll see autocomplete on the right in ThemeRoller, it will be styled live as you make changes to the theme.