[javascript] Professional jQuery based Combobox control?

Are there any professional Combobox controls (dropdown list with autosuggestion) based on the jQuery library?

It should be able to handle large datasets and have some skinning options. A multi-column result list would be great too. I'm working with ASP.NET, but it's a not a problem if I had to write a wrapper for it.

I'm already using a third-party control, but I ran into some compatibilty issues between two vendor's controls. Well, I want to get rid of this kind of dependencies.

Here's a really cool one: http://www.xnodesystems.com/ The Dynamic List Field not only has the autocomplete capability, but also is able to do validation.

Why don't you try http://jqueryajax.codeplex.com/. It is a collection of ASP.NET controls that contains multicolumn drop down as well.

Anyone looking for a jquery "combo box" seems to be directed to this question. My post is for people coming to this page to find a "traditional" combo box, rather than an answer to the original question. The above solutions all focus on using the input as a means to filtering and autocompleting to an existing select value. (great for large datasets)

If you're looking for the traditional combo box, which is simply "Type something or select from these pre-defined values" (no we won't hide the ones that don't match while you're typing), all you may need to do is

<select id="combo4" style="width: 200px;"
            onchange="$('input#text4').val($(this).val());">
    <option>option 1</option>
    <option>option 2</option>
    <option>option 3</option>
</select>
<input id="text4"
       style="margin-left: -203px; width: 180px; height: 1.2em; border: 0;" />

See http://bit.wisestamp.com/uncategorized/htmljquery-editable-combo-2/

Should be easy to wrap this into a plugin that converts an existing select tag, though I haven't seen that done yet.

P.S.: The main problem I see with "jQuery Editable Combobox" is that it remains a select list, and it is not obvious at all that you can just start typing something new.

For large datasets, how about JQuery UI Autocomplete, which is basically the "official" version of Jorn Zaeferrer's Autocomplete plugin?

I also wrote a straight JQuery combobox plugin that's gotten pretty good feedback from its users. It's explicitly not meant for large datasets though; I figure that if you want something that prunes the list based on what the user types, you're better off with Jorn's autocompletion plugin.

A new fork of the sexy-combo project is now out which looks promising: http://code.google.com/p/ufd/

Another nice plugin is Sexy Combo

This is also promising:

JQuery Drop-Down Combo Box on simpletutorials.com

I like select2, it's feature-rich and nice and active. Particularly like the diacritic search feature.

Why don't you try http://jqueryajax.codeplex.com/. It is a collection of ASP.NET controls that contains multicolumn drop down as well.

If you don't need multi-column, chosen is another good choice. MIT Licensed

An official jQuery UI ComboBox/Autocomplete component is in the making... (previously in beta for jQuery UI 1.5.x), see jQuery UI Wiki

UPDATE:

Autocomplete functionality is now a core feature of jQuery UI, see docs.

I had the same problem, so I ended up making my own.

It has a template system built in, so you can make the results look like anything you want. Works on all major browsers and accepts arrays & json objects. http://code.google.com/p/custom-combobox/

Highly recommending Twitter Typeahead:

http://twitter.github.io/typeahead.js/

Try this one:

http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxcombobox/index.htm

Very nice with many features including localization.

Anyone looking for a jquery "combo box" seems to be directed to this question. My post is for people coming to this page to find a "traditional" combo box, rather than an answer to the original question. The above solutions all focus on using the input as a means to filtering and autocompleting to an existing select value. (great for large datasets)

If you're looking for the traditional combo box, which is simply "Type something or select from these pre-defined values" (no we won't hide the ones that don't match while you're typing), all you may need to do is

<select id="combo4" style="width: 200px;"
            onchange="$('input#text4').val($(this).val());">
    <option>option 1</option>
    <option>option 2</option>
    <option>option 3</option>
</select>
<input id="text4"
       style="margin-left: -203px; width: 180px; height: 1.2em; border: 0;" />

See http://bit.wisestamp.com/uncategorized/htmljquery-editable-combo-2/

Should be easy to wrap this into a plugin that converts an existing select tag, though I haven't seen that done yet.

P.S.: The main problem I see with "jQuery Editable Combobox" is that it remains a select list, and it is not obvious at all that you can just start typing something new.

I found this other one: http://code.google.com/p/jquery-jec/

Also seems like a good option.

http://www.erichynds.com/jquery/jquery-ui-multiselect-widget/

Here's one that looks very promising. It's a true combo - you see what you type. Has a cool feature I haven't seen elsewhere: paging results.

FlexBox

all what you need http://jquerycomboboxtmpl.codeplex.com/

drop-down on templates

I've tried http://jqueryui.com/demos/autocomplete/#combobox and the problems faced were:

• Cross browser rendering
• Inability to submit custom value

As a result I've tweaked it a bit and it worked fine for me in ASP.NET MVC. My version of CSS and widget script can be found here http://saplin.blogspot.com/2011/12/html-combobox-control-and-aspnet-mvc.html

Sample on binding MVC model to custom value is also there.

For large datasets, how about JQuery UI Autocomplete, which is basically the "official" version of Jorn Zaeferrer's Autocomplete plugin?

I also wrote a straight JQuery combobox plugin that's gotten pretty good feedback from its users. It's explicitly not meant for large datasets though; I figure that if you want something that prunes the list based on what the user types, you're better off with Jorn's autocompletion plugin.

all what you need http://jquerycomboboxtmpl.codeplex.com/

drop-down on templates

I had the same problem, so I ended up making my own.

It has a template system built in, so you can make the results look like anything you want. Works on all major browsers and accepts arrays & json objects. http://code.google.com/p/custom-combobox/

I've tried http://jqueryui.com/demos/autocomplete/#combobox and the problems faced were:

• Cross browser rendering
• Inability to submit custom value

As a result I've tweaked it a bit and it worked fine for me in ASP.NET MVC. My version of CSS and widget script can be found here http://saplin.blogspot.com/2011/12/html-combobox-control-and-aspnet-mvc.html

Sample on binding MVC model to custom value is also there.

Activewidgets has a very nice looking one. No idea how well it performs on large datasets. http://www.activewidgets.com/ui.combo/

Here's a really cool one: http://www.xnodesystems.com/ The Dynamic List Field not only has the autocomplete capability, but also is able to do validation.

Activewidgets has a very nice looking one. No idea how well it performs on large datasets. http://www.activewidgets.com/ui.combo/

Here's one that looks very promising. It's a true combo - you see what you type. Has a cool feature I haven't seen elsewhere: paging results.

FlexBox

Sexy-Combo has been deprecated. Further development exists in the Unobtrusive Fast-Filter Dropdown project. Looks promising, as i have similar requirements.

https://code.google.com/p/ufd/

Here's one that looks very promising. It's a true combo - you see what you type. Has a cool feature I haven't seen elsewhere: paging results.

FlexBox

Sexy-Combo has been deprecated. Further development exists in the Unobtrusive Fast-Filter Dropdown project. Looks promising, as i have similar requirements.

https://code.google.com/p/ufd/

I found this other one: http://code.google.com/p/jquery-jec/

Also seems like a good option.

I'm looking for the same. The one I liked most till now is this one for ExtJs - except I havent tested it with large Lists: www.sencha.com/deploy/dev/examples/form/combos.html

Here is another really(!) fast one: http://jsearchdropdown.sourceforge.net/

For example the SexyCombo works quite fantastic but is way to slow for longer lists. The SexyCombo folk UFD is a lot faster, but initialization time is still quite slow for really huge lists. Besides I get sometimes some little! "flashing". But I guess there will be some updates in the near future.

For large datasets, how about JQuery UI Autocomplete, which is basically the "official" version of Jorn Zaeferrer's Autocomplete plugin?

I also wrote a straight JQuery combobox plugin that's gotten pretty good feedback from its users. It's explicitly not meant for large datasets though; I figure that if you want something that prunes the list based on what the user types, you're better off with Jorn's autocompletion plugin.

I like select2, it's feature-rich and nice and active. Particularly like the diacritic search feature.

Try this one:

http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxcombobox/index.htm

Very nice with many features including localization.

A new fork of the sexy-combo project is now out which looks promising: http://code.google.com/p/ufd/

Here's one that looks very promising. It's a true combo - you see what you type. Has a cool feature I haven't seen elsewhere: paging results.

FlexBox

Another nice plugin is Sexy Combo

An official jQuery UI ComboBox/Autocomplete component is in the making... (previously in beta for jQuery UI 1.5.x), see jQuery UI Wiki

UPDATE:

Autocomplete functionality is now a core feature of jQuery UI, see docs.

http://www.erichynds.com/jquery/jquery-ui-multiselect-widget/

For large datasets, how about JQuery UI Autocomplete, which is basically the "official" version of Jorn Zaeferrer's Autocomplete plugin?

I also wrote a straight JQuery combobox plugin that's gotten pretty good feedback from its users. It's explicitly not meant for large datasets though; I figure that if you want something that prunes the list based on what the user types, you're better off with Jorn's autocompletion plugin.

This is also promising:

JQuery Drop-Down Combo Box on simpletutorials.com

If you don't need multi-column, chosen is another good choice. MIT Licensed

I'm looking for the same. The one I liked most till now is this one for ExtJs - except I havent tested it with large Lists: www.sencha.com/deploy/dev/examples/form/combos.html

Here is another really(!) fast one: http://jsearchdropdown.sourceforge.net/

For example the SexyCombo works quite fantastic but is way to slow for longer lists. The SexyCombo folk UFD is a lot faster, but initialization time is still quite slow for really huge lists. Besides I get sometimes some little! "flashing". But I guess there will be some updates in the near future.

Highly recommending Twitter Typeahead:

http://twitter.github.io/typeahead.js/