5 jQuery UI Autocomplete Examples
The jQuery UI Autocomplete widget enables users to quickly find and select from a list of values as they type. If you find the jQuery UI Autocomplete demos and documentation too daunting, here are some examples with explanation to get you started. Using Label-Value Pairs Add CSS Class to the Dropdown Load Data via AJAX Highlight Matched Text Custom HTML in Dropdown A note before you begin: the autocomplete data should look like one of the following regardless of the source option: An array of strings e.g. ['Option 1', 'Option 2'] An array of objects; each object having label and/or value (and additional) properties e.g. [{label: 'Option 1'}, {label: 'Option 2'}] [{value: 'Value 1'}, {value: 'Value 2'}] [{label: 'Option 1', value: 1}, {label: 'Option 2', value: 2}] If necessary, the widget normalizes the data behind the scenes to match the last format in the above mentioned list. Using Label-Value