Dynamic Form Inputs - Hidden? Hidsb

Question

I'm working on a responsive site where the lead gen form that needs users to select a store location (this is required by internal system), first name, last name, phone, email, and how they heard about the company.

There are currently 120 locations, which makes having them all in a drop down super long. I currently have it broken into two drop downs where you select your state, then the next drop down appears below it showing only the locations within that state. For some states there is only one location, so I'm not making the 2nd drop down appear.

The users also need to choose how they heard of the company. There are about 5 main categories like Radio,search engine, tv. There are also sub categories, like multiple different radio stations. Knowing the referral info is also required by the internal system.

What would be the best way to show this form to make it easy for users, even with a lot of inputs. Should things like location be hidden until the state is selected?

What do you all think?

Answer 1

In my opinion, I will break this down into 3 part. First form will require the person's personal info such as the name and contacts. After the user complete the form, then prompt the other 2. This will effectively reduce the cluttering on the screen.

The choice of using a list over a drop down as it's easier to view all.

You might want to add in Location services. Can determine where the user (e.g. State) is accessing and pre-select for the user.

Answer 2

Remove the need for drop downs at all, use form auto complete, you only have 120 locations so this shouldn't be a problem for speed.

The user types in their first few letters and you give them the options based on their input.

Answer 3

Definitely separate it in different steps will be a nice organised and clear option.

I would use text input field at least for the State, it's a field that everybody would know and it will be faster for them type it than look for it in a long list. Here the user can start typing the State and with a proper autocomplete do the rest as Andrew Scott said.

Here you have an interesting and nice to read article about autocomplete (for country selector in this case, but can be apply to yours):

http://baymard.com/labs/country-selector

About "how they heard of the company" is more difficult to use the previous option since the user doesn't know which options are to start typing.