Telerik blogs

It is considered a good interface design practice to make it easy for the user to provide input.  One of the ways to do this is to anticipate what the user is trying to enter and provide them with options or complete the entry for them.  For example, if I type in a popular browser a web address containing the letters "tel" I will see several options made available to me, as shown below.

image

The key is to have the ability to make a reasonable guess at what the user is trying to input.  This is particularly helpful for values that are long and/or hard to type like a URL or e-mail address.  I am sure most developers appreciate Intellisense which anticipates the code they are attempting to implement.  Intellisense is a form of AutoComplete and saves a considerable amount of time and effort for many developers. 

It seems a rather elementary topic to blog about, but so many times AutoComplete is not implemented despite how simple it is.  To setup the AutoComplete capability you simply need to set the AutoCompleteMode property of the RadComboBox.  You have a few options available for the AutoComplete behavior which I have outlined below.

AutoCompleteMode.None

This setting is self explanatory and the default value for AutoCompleteMode.  If you do not want AutoComplete implemented or plan to write your own custom AutoComplete for the RadComboBox, this is the setting to use.

AutoCompleteMode.Suggest

The Suggest option is what was essentially displayed in my earlier example where I had entered a URL and options were displayed.  As the user types an entry into the text box, the drop-down portion of the control is shown, and the first item in the list that matches the input is highlighted.

image

AutoCompleteMode.Append

If you want to bypass showing the drop-down and just change the value as the user types then the Append option is available. As the user types, the next item in the list that matches the user input is automatically appended to the characters the user has already typed. The drop-down list is not shown without the user clicking the arrow.

image

AutoCompleteMode.SuggestAppend

This is as you might expect, a combination of both features.  So it is similar to the Append setting, but the drop-down list is shown and the suggested item is highlighted

image

So with a simple property you can implement AutoComplete in a variety of forms.  This is a quick and easy feature that your users are sure to appreciate.


Comments

Comments are disabled in preview mode.