So I have a form with two inputs. The first one is for a product search and another for choosing its location - city. As I'm predicting, 80 percents of the time, the location will be user's current city. But in case he decides to search other cities, I need to find the best way to get user's input. In my opinion, SELECT input isn't friendly for users due to countries, cities list's length and auto complete lacks of the accuracy. So what could be used between these two extremes?


2 Answers 2


If the percent of user looking on their city is so high I would set as default the user's location and a CTA next to it to choose "Other location".

I think write the name of a city is faster than look for it in a list. For this, there are some interesting articles like: Redesigning the country selector which contain at the end a link to an advanced auto-complete.

You can also give the two options, so a textfield to enter the city + proper auto complete and the possibility to open a list with the cities where I would put the most common one on top.


You could try out a mix between a dropdown and an auto-complete, searching for each part of the "location path" separately, starting with "City", thus the autocomplete will discard most of the possible results quickly, and then if the user has/wants to scroll, it will be just a bit.

Some details:

  • By default show all results.
  • Apply to the results container something like {overflow-y: scroll}, so a scroll bar appears if results are (for example) more than 4 (as in my mockup).


download bmml source – Wireframes created with Balsamiq Mockups

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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