HTML Form text input suggestions box

I am attempting to modify one of my text input boxes in a form that I have. I would like suggestions to pop up as the user types. Basically, I would like to emulate the "Tags" box that is on the ask question pages here on Stack Overflow, but with dif开发者_如何学Goferent data as the suggestions obviously. How would I go about doing this?

For context, this is for a club at a college, and I am trying to allow members to type in their majors and as they type have a suggestions come up.

This snippet from Cena Mayo did just what I was looking for:

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

Documentation

jQuery has an autocomplete plugin that you could use.

It depends on what kind of language/platform/etc. you are using as well. I am a primarily .NET developer and I've used the following:

1. SQL Server for storing data
2. Web Forms or MVC for the web app
3. An ashx handler to retrieve and format the suggestions
4. jQuery plugin above to render the results returned from the ashx underneath an input box

Well if you want to get information from a database on commonly used or already created elements you'll need more than just html. If you just want the form to suggest things people have already input in their own browsing sessions the form will do that automatically.

What I can point you towards is this guys post. He outlines and gives the basic code to get you started on the path for auto suggestion in forms He even gives you the files to get you going, but you'll have to do some modification work.

Also included later in the post somebody adds this to go into the ajax_framework file.

`function clearsuggest() {

e = document.getElementById('results');

e.style.display="none"; } `

In search.php: onClick="fill();clearsuggest();return false;"

That section of code will clear the suggestions upon click of a suggestion. Hope this helps and good luck.