I am designing a web page for mobile devices as I have limited screen space. The web page is used to select a store name from a list of stores (which the user entered earlier) or enters a new store name along with some details about the store.

My idea was to have:

1st line: comboxbox which works like an autocomplete/dropdown list of names of previously entered stores. User either selects or starts typing and list gets filtered as he types.

2nd line: the text 'OR' (to indicate another action the user can take)

3rd and subsequent lines: text fields for capturing information about the new store.

So the user has two actions in this page. Selects an existing store in list and he's done or enters a brand new store including related info.

Other suggestions for creating this. I am not sure what UI elements will be available for me. I will be using jQuery Mobile for the UI.

1 Answer 1


Selecting an existing store usually is way more common than entering a new one, so putting both actions on the same page doesn't look suitable.

I would recommend to use the drop down box (with a quick search filter if there's more than 2 dozen items), with a last item

Select Store|v
Store A
Store B
Add New store...

Selecting that item could bring up a page to enter store details.

(I am not sure if you can realize the cursive item or the quick search wihtin the combo box with jQuery mobile - but at worst you can fall backto a "normal" combo box).

Alternately, the "Add new item" could be a separate link / button besides the combo. This improves discoverability for novice users, but steals screen estate for a settled state (i.e. when stores are already entered).


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.