I have this app where file types define the allowable files that a user can submit. What's the best way to let user show/select any filetypes? See my two potential solutions below.

Is there another pattern I can use for it?

enter image description here


enter image description here

1 Answer 1


I see that those file types can be classified as text or image files, so it'd be recommended to offer the option to select all the files of one type just with a click.

Also it provides better organization (even better if you order them by most used or alphabetically).

If the user wants to select by file type, the max amount of clicks needed is 1 so it can't get simpler from that point of view. Also checkboxes are familiar with the majority of the users and bring much less confusion compared with other options.


download bmml source – Wireframes created with Balsamiq Mockups

  • 1
    +1 for both checkboxes and grouping. I'd suggest Images (plural) and Documents (rather than Text Files which often means raw text format) as labels. The grouping is a great approach: it uses plain english for users, and organizes the horrific wall of 10+ options for users.
    – tohster
    Commented Apr 14, 2015 at 16:52
  • 1
    I agree with your comment. I had labeled it "Image Files" but I didn't realize the label was too short in size and cropped the text. Good observation about Documents vs text files. I've edited that and some grammar too. Commented Apr 14, 2015 at 17:30
  • If I will use this pattern, is it okay to use expand/collapse (+) or caret? example: 100 items under images
    – Sknny
    Commented May 16, 2017 at 3:56

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.