The Australian Government coat of Arms

Communities of practice

Communities of practice

Autocomplete

search

#1

Moved from: https://github.com/govau/uikit/issues/187

An Autocomplete predicts the word a user intends to enter after only a few characters have been typed into a text input field and provides the user with a set of matching suggestions.

Design

Inspiration

Animated GIF showing a user using a location picker autocomplete field

Source:
We’re building an autocomplete, Design notes, gov.uk

Source: Healthdirect

Source: Service NSW

Code

Similar open-source projects:

We could progressively-enhance the HTML5 datalist element.


Address autocomplete provider
#2

I’d add Twitter’s Typeahead.js to the list of similar projects above.


#3

Also:


#4

This is a really good breakdown of whats required for an autosuggest control to be accessible http://intopia.digital/articles/anatomy-accessible-auto-suggest/


#5

GDS has released their autocomplete component and has published a new blog detailing their experience doing extensive accessibility testing.

They also have a country and territory autocomplete and a government organisation autocomplete which are both worth looking at.