what is the best way to have an autocomplete at the bottom of a webpage

Question

I have a webapp, and it has a list of items at the bottom of the page. The last item is a textbox with autocomplete. So the text box is right at the bottom of the page. I want the textbox to do autocomplete, so I guess I have two choices, I can push the autocomplete entries off the edge of the page so the user can scroll to see them. Or I can make the bottom autocomplete item the bottom of the page essentially scrolling the text box up and down depending on the number of entries.

Is there a better way of doing this? Does anyone have any examples of autocomplete at the bottom of a page?

Answer 1

If you have a textbox at the bottom right of the page, a way to implement this is to let the suggestions expand up and to the left, if needed. If there are to many entries, scroll can be used or you can minimize the suggestion to make them fit by disable scrolling. If scroll is disabled, the user may need to continue typing to see the actual entry she is looking for and select that one. If there are more entries than what fits on the screen, visualize it with three dots at the bottom [...]

^{download bmml source – Wireframes created with Balsamiq Mockups}

The benifit of this is that the textbox that the user types in doesn't move around on the screen, which improves usability. Moving text entries would impair the User Experience.