Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Ruh Ullah Shah
PLUS
Ruh Ullah Shah
Courses Plus Student 5,111 Points
Posted by Ruh Ullah Shah
Ruh Ullah Shah
Courses Plus Student 5,111 Points

Creating a suggestion list for HTML form input elements

HI,

I have a form and I want to show a suggestion list for a text field once a user starts typing in. Can I get some suggestions as to how I can accomplish this?

Thanks, Ruh Ullah Shah

3 Answers

Cena Mayo
Cena Mayo
55,236 Points
Cena Mayo
Cena Mayo
55,236 Points

In HTML5, you can use the datalist element; for example:

<input id="color" list="suggestions">
<datalist id="suggestions">
    <option value="Black">
    <option value="Red">
    <option value="Green">
    <option value="Blue">
    <option value="White">
</datalist>

The Treehouse blog has an article about this, and Noupe.com goes into a little more detail.

Rony Alvarez
Rony Alvarez
14,515 Points
Rony Alvarez
Rony Alvarez
14,515 Points

Exactly what I was looking for, thank you so much!

Muhammad Mohsen
PLUS
Muhammad Mohsen
Courses Plus Student 10,843 Points
Muhammad Mohsen
Muhammad Mohsen
Courses Plus Student 10,843 Points

Hi Ruh,

Maybe typeahead is what you looking for?

https://twitter.github.io/typeahead.js/

Ruh Ullah Shah
PLUS
Ruh Ullah Shah
Courses Plus Student 5,111 Points
Ruh Ullah Shah
Ruh Ullah Shah
Courses Plus Student 5,111 Points

Thanks for the answers Mohsen and Cena. I will try the approaches suggested by you guys.