Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

In auto-complete input fields, the suggestions are usually optional, but the user can type whatever he wants.

I want to force the user to choose from the suggested list.

The best option I can think of is to choose the first option by default (while he can keep typing), and if no results are found - delete the last character (recursively).

Is that the right way to do so? Any reference to this behavior online?

share|improve this question
add comment

5 Answers

up vote 1 down vote accepted

Are you completely free to design this control? If I were designing a GUI control for this requirement, I would think about two ways of doing it.

One would be to completely reject a character which causes the input typed so far to no longer be a viable prefix for any matches. As in, make it impossible to type, but with some kind of feedback that the character is being rejected. (Something visual happens in the input field, and there is a sound; it must never look like the interface has become unresponsive.)

Another approach would be to allow the user to type arbitrary input (which is what you seem to want), but to apply syntax coloring to distinguish the valid prefix from an invalid suffix. Characters that do not complete could be colored red, or something like that, and the GUI would prevent that input from being submitted while it contains a trailing portion that is flagged as an invalid suffix.

The user can realize his or her mistake and backspace over the flagged characters.

At all times, the possible choices should be shown (unless there are too many, in which case you want to condense the list in some sensible way) and it should be possible for the user to just shortcut to one of the choices.

share|improve this answer
    
Very creative. Thanks! –  Eyal Shahar May 4 '12 at 21:48
add comment

It sounds to me like in that case it's more of a dropdown/select combobox.

You can try a version of it HERE in the sampler for the Vaadin framework.

share|improve this answer
4  
You can make an autocomplete text box only accept input from the suggestions too if you want, though it would break people's expectations. –  ChrisF Apr 23 '12 at 13:15
1  
@ChrisF you're right. and for that reason it would be good to style the input field as selection element with input prompt. –  AndroidHustle Apr 23 '12 at 13:20
1  
Dropdowns/Listboxes are no good if there are thousands of records. I think the best solution here would be a textbox, which filters a listbox of results - one (or however many) of which should be selected to progress. –  Anonymous Apr 23 '12 at 15:33
    
@Anonymous- did you check the link? except for having a expand button that's pretty much exactly what you described. –  AndroidHustle Apr 23 '12 at 20:53
    
@AndroidHustle - I don't see how that forces you to pick a city rather than type a new one in? –  Anonymous Apr 24 '12 at 7:37
show 5 more comments

It really depends on how many answers or options you are going to give the user. If it is a field of hundreds of possible choices, a drop-down list would be cumbersome and scroll forever. If you are only talking about 10-20 or so, then a drop-down is perfectly acceptable.

If your list is large, I like letting the user begin to type and answer and pick from the list that auto populates. @AndroidHustle gave a good example with the Vaadin framework.

Here is another example of a list that populates while you type, but will only accept one of the pre-determined answers.

http://jqueryui.com/demos/autocomplete/

share|improve this answer
add comment

You can use either client or server side validation to do it. Use something similar to FilteringSelect widget of DOJO: http://dojotoolkit.org/reference-guide/1.7/dijit/form/FilteringSelect.html#dijit-form-filteringselect

At server side you can validate input and refuse "made up" values. And of course, you can combine both.

Another option is to use pure Combo (SELECT), many browsers support "typeahead" - query for value in it. But many users do not know/use it.

share|improve this answer
add comment

A combo box (textbox / drop down) creates the expectation that users can make any choice they like. I do not recommend using this control if the user is not allowed to provide new choices. Instead I would provide a normal drop down control, which still allows users to select by typing in most user interfaces.

In particular, even if you choose to retain their ability to type arbitrarily, you should not silently ignore what they type. If they type a choice that is not available on the list they need to resolve that conflict manually rather than have the system try to pick one for them. For example, filling out a result of Ontario in a box that auto-switches it to Oregon (because the form is US only) is going to cause far more problems than it resolves.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.