1

I am working on a table that displays rows of data, and each row contains a column with a short list of items (typically 3 items). When a user clicks a "Show More" button, the list expands to reveal all items, which can range from 5 to 30 items long. Additionally, some of these items have extra information that needs to be displayed.

Currently, the implementation results in a very tall row that can be visually overwhelming and difficult to navigate, especially since I have limited horizontal space and cannot widen the column significantly.

Are there any best practices for handling long lists in table rows that maintain usability and readability?

Mockup: enter image description here

0

1 Answer 1

0

Rather strange to have a table inside a table cell... but let's have try.

If there is no need to compare the contents of the item lists in multiple rows, then you could work with a popover: Click on the "more" button and display an overlay containing all items including descriptions. The popover can have a small triangle pointing to the cell it originates from, and disappears when the user clicks outside of it (if there's nothing interactive inside, maybe there as well).

Depending on whether the user needs to see the "other fields" in the same row, place the popover either to the right (hiding the other fields) or above or below the item list cell (not hiding the other fields, but slightly strange placement).

If you tell us more about the users and their goals, we may be able to give better hints.

EDIT: Because you replied "with large amount of data, that's why tables looks like nice choice to represent this data", let me make this point: The larger the amount of data becomes, the less likely it is that a table is a good, user- and goal-supporting choice. I design for data in the millions, and the best approach here is to make the system smart enough to find the interesting rows and only show them.

How to determine what is interesting to the user depends a lot on your business: Sometimes it can be supported by ad-hoc filters, it could mean predefined filters which generate alerts, or maybe you have good statistics (or a smart AI already) to single out the unusual cases. Displaying only them relieves the user from searching/browsing through large tables.

1
  • this table is a part of admin side of a project. We work with large amount of data, that's why tables looks like nice choice to represent this data. Talking about this table specifically, each row shows several connected entities grouped by category. The list of items - it is a list of products. Short list - most popular ones. Admin needs to look at them sometimes and check their descriptions, but it isn't significant enough to extract them to a new page. I understand, that having pretty big list inside table cell is weird, but what might be a better solution here? Commented Nov 2, 2024 at 9:57

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.