enter image description here

Ok first things first. I did not design this layout but all feedback is appreciated. I have a web app that takes in a user file and spits out a table. the table also has hierarchy.

Lets say its a sales analysis tool and you upload the companies you sold to. This tree is an industry report that tells the user his performance in specific industries. Now the industries are nested. Example - Computer Hardware -> Memory Device manufacturing -> Solid state memory device industry.

there could be many levels depending on the industry and the user's imported sales file.

Problem is, there may be thousands of industries within a particular 'Parent item'. So if I paginate on lets say 100 items per page, I would violate that if I expand the first parent item. and I cannot calculate how many total level 4 items there are and fix pagination on that because that is causing page load delays.

I absolutely need the tree table because the other columns have numbers that users can compare on.

not having pagination at all will be very messy and long.

There are filters that you can use and cut down the # of parent items based on any of the variables in the other columns.

  • Just wondering, you mentioned that there are filters you can use, but does the table also allow sorting? I imagine that it would be very difficult to navigate as it is with potentially thousands of entries, and if this is the normal case rather than the exception then I strongly suggest separating the tree from the table between it is much more difficult to use and maintain in the long run. I could be wrong but you can definitely test it and find out for yourself. I would hate to have to build something where the design is not optimal for the users.
    – Michael Lai
    Commented Apr 16, 2013 at 23:30
  • I agree Michael. Yes the table does allow sorting on each column. Lets say you sort by Sale Value Descending, then it will sort all Parent items first, then child items within a parent and then next level and so forth. I am planning a test as well.
    – imbakaran
    Commented Apr 17, 2013 at 14:37

3 Answers 3


The are a few thing that i would suggest.

  1. Load the tree collapsed - Minimize the initial number of rows that are presented to the user.

  2. Implement Filters - a quick search that will filter all current nodes by a keyword\ phrase would be most useful here.

  3. As a last resort implement pagination - While paging will help you to "jump" to the 100th page faster i would doubt that a user will want to get that far, he would rather use a quick filter.


I don't see a problem with the expansion of a paginated list. When you paginate the table at 100 rows, you are paginating 100 top level (parent) rows. When you expand any parent row to see the daughter rows, you are still locked in at 100 parents.


Seems to me like opening a top level item should be producing a sub-view which is not within the same, pre-paginated, table but instead within a new table of its own with its own pagination - solutions I can think of for how to present these sub-views include a tabbed interface with sub-views loading into new tabs or have sub-views as temporary overlays.

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.