Below there is a modal where I have three categories that contain the same tree structure.

Is there a way I can consolidate or simplify these three structures into one or maybe restructure this in a way where I don't have to repeat the tree several times?

enter image description here

  • 1
    Have three checkboxes (labelled appropriately) per item in the one tree? – mgraham May 23 at 12:26
  • Can you clarify the task? Does the user need to choose one of A, B or C or are multiple choices OK? Can the user choose A, B or C without choosing any of the categories underneath? Can the user choose one of the categories under type A, B or C without choosing the type itself? – qoba May 26 at 6:32

That's a right decision not to repeat the tree three times. Thus, a task can be set this way:

How to allow selection of three types (A, B and C) at each node of a tree structure?

Assuming that each node can represent a subtree, a toggle buttons group can be used for this purpose with the following states defined:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

It will result in a layout like this:

mockup

download bmml source

And this, for the case when all top-level nodes are folded:

mockup

download bmml source

Please, note that a leaf node (the one with no children) cannot be in second state (some childs selected). A user can only select and unselect it, while such state resolves automatically for its parent node.

Your sketch shows checkbox - can user check 2 categories and positions below or its impossible?

For now I would do something like that: version 1

or something like this

version 2

You could use a table, similar to tables describing the features included or not depending on the plan chosen.

enter image description here

Your table would be much simpler. Columns would be type A, B, C, and the rows would be business services, consumer good, etc.

I think it would make it easier for the user who want only 1 category for all 3 types, to check 3 boxes next to each other, rather than switch tab or change the dropdown menu.

I would also give a good overview of which categories are included for each type, without having to open sub-folders.

Your Answer

 
discard

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

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