Creating an Auto-complete textbox

It seems that auto-complete is very popular these days with different sites.  So I wanted to show you how you can create your own Auto-complete textbox on your web sites.  There are two ways that this can be accomplished depending on what you are using and what you want to use.

Ajax control toolkit

This method is described very well on the following blog post: ASP.NET MVC Tip #37 – Create an Auto-Complete Text Field.  The best thing about this method is that you can use a webservice as the backend for what you call to get the data back.  This enables you to have a database of possible results and populate the box as the person types.  For example, if you were going to write a web site that allows someone to post a blog, you could have a Auto-Complete textbox for the tags on the post.  Pulling down the list of tags they have used in the past.

JQuery

Another way to accomplish this is to use JQuery.  With this javascript library, you can get this to work pretty easily.  To see how, check out: UI/Autocomplete on JQuery.com.  This also has some advantages, less code and easier to setup.  But would take some more to make it more powerful, like adding Ajax to make a call to the server.  But if you have a known list, this could be really nice and would be quick.

Silverlight

You can also use Silverlight to make an Auto-complete textbox.  This method is described by Nikhil on his blog here: Silverlight AutoComplete.

 

I hope this gives you some options to add this useful method to your web sites.  Feel free to post other methods here as well.

Comments