<combobox>

Creates an enhanced version of the jQuery-UI demo combobox. This will turn any select (even a select-many) into a combobox.

Standard usage:

<combobox>
  <select .../>
</combobox>

If you don’t supply the select, it will use Hobo’s <input> tag. This is usually the right default.

You can tell Hobo to always use a combobox for select-one, select-many, select-input and/or select-menu. Notice that we also changed the limit - 100 is the default, which makes sense for a select, but not for a combobox.

<extend tag="select-one">
  <combobox tag="select-one">
    <old-select-one limit="5000" merge/>
  </combobox>
</extend>

To make the behavior more like the demo’s, turn off autoFill and clearButton:

<combobox autoFill="&false" clearButton="&false"/>

Combobox is a new control that is built on autocomplete. The autocomplete options may not be used directly. If you need any of them let me know, they should not be too hard to add if you volunteer to test them.

Parameters

  • default
    • input

Attributes

  • autoFill (default: true): select first value rather than clearing if there’s a match

  • clearButton (default: true): add a “clear” button

  • adjustWidth (default: true): if true, will set the autocomplete width the same as the old select. (requires jQuery 1.4.4 to work on IE8)

  • uiStyle (default: false): if true, will add classes so that the autocomplete input takes a jQuery-UI style. If false, the standard Hobo style is used.

Events

  • selected (default: $(this).trigger('change');):

Show Source


Edit this page