User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

What is the best way of implementing something like this on a mobile device?

enter image description here

Which is an example of a multiselect dropdown box with a hierachy implemented in JQuery UI:

From here:

I am using JQuery Mobile.

My requirements are:

  • Around 5-30 checkboxes, depending on scenario
  • Hierarchy that may be multiple levels deep (5?), and then the ability to deselect all children by clicking on the parent
  • Doesn't make sense to use a 'autofill' 'autocomplete' control anywhere, as the user will not have any prior knowledge of what the options are

Some problems:

  • If the checkboxes aren't nested in an accordion style, then it might end up being a really really long list of checkboxes
  • If it is split into lists of checkboxes on different pages, how can I easily see a global view of everything that is selected? Is this too much effort?

I don't mind what the solution is, it doesn't have to be a single dropdown, it could be separate lists, pages... obviously screen real estate is at a premium. Anyone attempted something like this on a mobile device, or knows of any good examples?

Previous research:

share|improve this question

enter image description here

I will go for such a solution.

If there is nested elements - give a visual cue.

If not - bypass

Hope that it helps.

share|improve this answer
Thanks, so each parent item would be like an accordion? So multiple nested accordions, each with a slight indentation on the checkbox buttons beneath? I think this would be fairly complex to construct but looks good to me. – Adam Marshall Jan 8 '14 at 15:17
My pleasure, before implementing it, you can ask to some other people, i did not ask to anyone. It is indeed complex but maybe there can be an easier way... – Abektes Jan 8 '14 at 19:36

Your Answer


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.