Autocompletion with HTML5 datalists

We have all used (and most of us built) an autocomplete input element. There are thousands of plugins/widgets out there, although below I’m demonstrating the easiest, most semantic and HTML5 way to build it without using Javascript! Just put a normal input element and connect it with the new datalist element by using the list attribute. That’s it! You’re semantically correct, HTML5 autocomplete input is ready!

See the Pen Autocompletion with HTML5 datalists by John Tsevdos (@tsevdos) on CodePen

Leave a Reply