• Edit
  • Delete

Javascript select box combo widget

Requirement

  • Allow to search in a select box
  • Replace a <select> box
  • Be degradeable for usage without javascript
  • Autocomplete like behavior for search string (search for "ab" returns all entries that contain "ab" in the list)
  • Still be browsable (down arrow button)
  • Simulate select box - The hidden field containing the selected "<option>" value must have the same name and id as the original select box
  • Set initial value to the value of the selected entry
  • Work with all wide-spread browsers including IE6
  • Be jquery-based so that no additional js library is necessary
  • Optional: ajax support for large lists with lazy loading

Candiates

SexyCombo

http://vladimir-k.blogspot.com/2009/02/sexy-combo-jquery-plugin.html

 

Problems

  • Doesn't really work in IE6 - only the first entry is displayed
  • Once an entry is selected, you can't browse anymore using the down arrow

FlexBox

http://www.fairwaytech.com/Technology/FlexBox.aspx

Problems

  • No option to simply replace a select box
  • No option to set the name and id of the hidden field
  • Setting the initial value (a id) using "initialValue" displays the id in the field and not the corresponding name

Autocomplete

 http://mabp.kiev.ua/2008/04/08/autocomplete/

 

Problems

  • Didn't get it work :-(

Quickselect

http://github.com/dcparker/jquery_plugins/tree/0ea47163c3ae4098f19f60b04aedfb4733bf6dc2/quickselect

 

Problems

  • No select-like down arrow for browsing

Extjs

http://extjs.com/deploy/dev/examples/form/combos.html

http://extjs.com/deploy/dev/docs/ -> search for "combo"

 

Problems

  • Large framework, not jquery based
  • IE6 rendering not convincing
  • No option found to search in the middle of words (Default = beginning of word)
  •