I´m working on the UI of the filter page that would allow the user to filter the Projects/Assets/Sub-assets to visualize the data. We are implementing a new "sub-asset" feature which will make the filter more complex. Right now we have two filter boxes - for projects. This fills up the box next to it called "case" with all the possible options of assets.

In the drawing below, I illustrated the updated version of the system - we are implementing the subassets where multiple subassets can have the same case. For this reason, the list in the filter box 2 is becoming longer and longer. Do you have any ideas on how to proceed with this to make the lists clear and short? I was thinking about implementing a new filter box next to it.

The old version of filter system, before implementing the sub-assets

Picture to visualize the data to filter

1 Answer 1


Consider using a tree view for better hierarchy visualization.

See tree view live example below: https://mdbootstrap.com/docs/b4/jquery/plugins/treeview/

If that's a filter with a multi-select option you can add checkboxes.

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.