A presentation of a select; usually similar to a textbox where users can type ahead to select an option, or type to enter arbitrary text as a new item in the list.

combobox is the combined presentation of a single line text field with a list box popup. The combobox may be editable. Typically editable combo boxes are used for autocomplete behavior,  and authors should set aria-autocomplete attribute on the text field.

In an input type text box when an auto complete behavior is present a combo box role is used. In addition, the aria-owns role option can be used to have a best experience. Take a look at the below example for a simple editable combobox with combobox role. 

Note: Elements with the role combobox have an implicit aria-haspopup value of true.

Example

<input type="text" aria-label="Wild Animals" role="combobox" aria-haspopup="true" aria-autocomplete="list" aria-owns="owned_listbox" aria-activedescendant="selected_option">
<ul role="listbox” id=”owned_listbox">
<li role="option">Zebra</li>
<li role="option" id="selected_option">Tiger</li>
<li role="option">Lion</li>
<li role="option">Elephant</li>
<li role="option">Fox</li>
</ul>

• If an author sets a combobox's value of aria-autocomplete to 'none' (default), authors must manage and set focus on the associated listbox, so assistive technologies can follow the currently selected value.
• If an author sets a combobox's value of aria-autocomplete to 'inline' or 'both', authors must update the value of the focused text field, so assistive technologies can announce the currently selected value.
• If an author sets a combobox's value of aria-autocomplete to 'list', user agents must expose changes to the aria-activedescendant attribute on the combobox while the combobox remains focused. If a change to the aria-activedescendant attribute occurs while the combobox is focused, assistive technologies should alert the user of that change, for example, by speaking the text alternative of the new active descendant element. Authors should associate the combobox textfield with its listbox using aria-owns. For example:

  <input type="text" aria-label="Tag" role="combobox" aria-expanded="true"
    aria-autocomplete="list" aria-owns="owned_listbox" aria-activedescendant="selected_option">
  <ul role="listbox" id="owned_listbox">
    <li role="option">Zebra</li>
    <li role="option" id="selected_option">Zoom</li>
  </ul>

To be keyboard accessible, authors should manage focus of descendants for all instances of this role.

Note: In XForms  the same select can have one of 3 appearances: combo-box, drop-down box, or group of radio-buttons. Many browsers allow users to type ahead to existing choices in a drop-down select widget. This specification does not constrain the presentation of the combo box.

Note: Elements with the role combobox have an implicit aria-haspopup value of true.