Questions tagged [data-tables]

A user interface element, where content is displayed in a list form, usually used in the context of the user having the choice between viewing content as a list or in some other form (eg. grid-view).

Filter by
Sorted by
Tagged with
212
votes
23answers
118k views

How To Display Too Much Data

We're building a web-based platform where the main dashboard shows a table of data for users to view and analyze. As we're growing this tool, we seem to be adding more and more columns and are running ...
73
votes
4answers
10k views

Is there a better way than zebra stripes

Currently we are working on a project that includes many datatables. Before deciding to use zebra stripes to make datatables easier to manage, I wanted to ask if you could advise a better solution ...
52
votes
4answers
10k views

When your page has no results, what do you show?

I am paginating a data table and have different views in my application where each view has its own rows. Some views may have data, some may not. Showing 1-0 of 0 Page 1 of 0 is what I am showing ...
33
votes
3answers
49k views

What is the best practice for data table cell content alignment

We are currently working on a windows based application where users capture data. Some data is captured in a table where other data is captured in text blocks. Im currently faced with the dilemma of ...
30
votes
10answers
4k views

How do you make it clear to the user when the data in a table is updating live (or not)?

We have a requirement to have a table of data update in real-time. New records will get added over time, as well as amendments on a cell by cell basis. However if a user changes the sort order, or ...
22
votes
4answers
3k views

Where should a newly added item go in table?

Admin tool. Table with thousands of items (users) sorted by name (from A to Z). The table has a pagination. Let's say you are on page #16 (out of 999). You are adding a new user. Where should the ...
21
votes
5answers
11k views

Table with actions per row

One of the pages in our web app includes a table that typically has a few dozen rows for each user, and it takes most of the page's width (5-8 columns). For each row, users can perform 3 possible ...
20
votes
8answers
4k views

How should “Select All” work in a “LOAD MORE” table?

We are building an enterprise which consists of tables with a lot of data. Our solution for the tables is to have an infinite scroll with a "Load More" button. There would be information of the ...
16
votes
3answers
2k views

Icons in table head - good practices

When to use icons instead of texts? Are there good practices related to the subject? Ex:
15
votes
6answers
3k views

In a static data table, should rows be highlighted on hover?

My team is building a Material Design table component. The Material Design guidelines on data tables state: Row hover (Desktop) Display a background in a table row if a user hovers over any ...
15
votes
3answers
3k views

Need a better layout, so that blank space can be utilized

Here - I don't want to repeat the same ID, first name and last name to all the subjects so I used expand buttons. - This approach significantly reduces number of rows that are visible when all the ...
13
votes
4answers
9k views

Editable table in material design

we're designing a web application in material design and we have an editable table there - something like this: Any suggestion on how to indicate the editable fields, if not all columns are editable? ...
12
votes
5answers
4k views

Sorting tables after multiple columns

I want to add a sorting functionality to a table. It should be able to be sorted after multiple columns. A standard approach is something like this: download bmml source – Wireframes created ...
11
votes
4answers
6k views

Tabular vs Card-based presentation, which is better for lots of data?

Basically, we have a long list of stuff that has, on its on, a lot of details. We are wondering whether to use a table or put each set in a rectangular card format. See below: On one hand, the table ...
11
votes
1answer
10k views

Material Design data table filtering

How would you implement filtering in MD data table? Sorting, paging and searching is obvious but I need more complex filtering. Should I put the filters on the table title or create a separate ...
10
votes
5answers
2k views

Should we use check boxes or not and select rows on click

We have a CMS like panel where user needs to manage orders. We have table which you can see below. A friend (who is known experienced in UX) says we should remove checkboxes and select/discard rows on ...
10
votes
8answers
2k views

What is the best way to indicate read-only cells within a table?

I have many tables, actually data grids, where most of the cells will be editable, but some may not depending on the users permissions. I am thinking of using light gray backgrounds on the read-only ...
9
votes
2answers
919 views

How do you keep your data tables simple?

Our company is trying to make our website simpler and easier than our competitors, and one thing that's difficult about that is our data. A big table of data is shown on most of our website's pages, ...
9
votes
4answers
1k views

How to create a custom textbox with a label and value

I am not a designer but I am dealing with a task to implement a functionality. I have to develop a working UI where a user can enter values into text-boxes inside a grid. While entering these values ...
9
votes
2answers
9k views

Best way to distinguish between completed and in-progress items in data grid

I have a data grid of items, and each item basically has two states: in-progress or completed. What's an elegant, concise way to make a visual distinction between the two states? For the time being, I'...
8
votes
3answers
306 views

Additional information for tables

I have to show some extra data to users. Column-sums, column-statistics (different values per column) and column-rests (the sum of all values for the columns, which are on pages not shown). These ...
8
votes
2answers
704 views

Listing multiple hierarchical data chunks of information in a table row

I need to show a list of hierarchically organized elements in a row set (it can be multiline, yet I need to compress it vertically as much as possible). There is some similarity to file paths - for ...
7
votes
8answers
5k views

Best approach for huge data tables (currently using scrolls)

Experts, I need help in assessing the best approach for huge tables (lets say 500 rows), we want something that is intuitive, visibly appealing and gives more focus to table data. Most pages will ...
7
votes
4answers
11k views

What's the best way to display hierarchical tabular data (parent/child relationship) while allowing both pagination and search?

I've run into a brick wall while trying to come up with a suitable tabular user interface for showing hierarchical data in a table while at the same time including a search interface and pagination. ...
7
votes
2answers
623 views

Not including a 'first page' and 'last page' button in a data table

So, in general my experience is that the Material Design spec by Google has been extremely well thought out, which doesn't mean I blindly follow it, but at least I think twice about every decision ...
6
votes
4answers
2k views

How to format tables with monetary data?

I am working on a web app that needs to display revenue data in a table, and I am not quite sure how to make it easy to read. Are there are any style guides or manuals that can help me? For ...
6
votes
2answers
346 views

Trouble creating surveys with iOS elements

I'm working with a client on a project that will include survey elements within the app. There are a few survey elements that I've never seen on a native app and would appreciate some guidance on how ...
6
votes
3answers
734 views

On/Off controls on an inline editable table

Background: We have a large fullscreen inline editable data table. The user can click to enter an individual cell and click outside to save their changes. Now we're looking to add an on/off setting ...
6
votes
3answers
2k views

Adding new item in a table list: At the end of the list or open a new page?

Which among the 2 ways of adding new data to table list is better and if so, in what context? END OF THE LIST (similar to adding new data in spreadsheet documents): OPEN A NEW PAGE FORM:
6
votes
3answers
246 views

Indented row headers

We have a screen layout where we have several columns to display. The problem is - you guessed it - real estate - to be able to fit all columns. This is for desktop, tablet and mobile screens. One of ...
6
votes
3answers
282 views

“Record in Use By Other User” Guidance: Try Again Later? Or Other Solution?

Considered we have a use case where the product technology doesn't allow edits of the same record at the same time (for example different users might be want to editing different parts of a customer ...
6
votes
4answers
373 views

Expandable rows, quick view or modal to show a big section with details for a row in a table?

I have a table and in the first version of the implementation, I had expandable rows with info. In the new version, the client wants expandable sections in the section expanded because it is a lot of ...
5
votes
3answers
3k views

Multiple similar tables with varying column widths

When multiple forms are displayed on a page that display the same type of data, grouped into categories, is it OK for the columns in each table to be varied or should fixed widths be used to enforce ...
5
votes
4answers
2k views

Boolean table cell values - best way to show Yes/No

I have a table with some columns showing Boolean values of Yes/No. What do you think is the best way to show it? Several alternatives I can think of are: Leave the Yes/No labels Utilize a Check-box ...
5
votes
4answers
778 views

Grid - Inline Editing and Sorting - How to handle the features together

The Dilemma: You have a grid/table with sorting (and/or multi-sort) and inline editing. The user modifies a value that should modify the sort order. What do you do? An Example: Lets take Mint.com....
5
votes
7answers
905 views

How could you indicate that data is 'copy and paste-able' but not editable?

I'm currently working on a data-rich desktop interface. We have a situation where we're displaying a long list of attributes. Unfortunately I can't go into specifics but ultimately the user can copy ...
5
votes
3answers
739 views

Is there evidence that text in a table vertically aligned middle is easier to read compared to vertically aligned top?

I have an html table and there is one column that is much taller than the others and I am trying to get a recommendation if I should be vertically aligning the rest of the columns to the top or middle....
5
votes
4answers
2k views

Form input types for fast data-entry?

So, I have a form for doing data entry where there is a list of items which have three fields. The first two fields of each item are multiple-choice from five options, the third field is a simple ...
5
votes
4answers
3k views

What is the best practice for data table filters?

For best user experience, what is the best practice for data table filters with 10+ columns ? User's Goal: The user is trying to filter the list using of various filter types dates, number and ...
5
votes
2answers
2k views

Data table with no data rows - show, or hide and display alt content

In a web page I have a table with a header row that is visually distinct from the data rows in the table 'body'. In some application states there will be no rows to populate the table and the header ...
5
votes
1answer
83 views

Getting large amounts of information from users

Say I have an app that requires a lot of information or insights about our users to function, what is considered the best way of going about this? Thinking about forms, they would be too large and ...
5
votes
1answer
473 views

A table within a table - Table Inception

Here is a little UX problem I'm working on right now and I'm posting it here because after a lot of research, there are not many good examples of this out there. The context: Consider this as a web ...
5
votes
3answers
2k views

Positioning scrollbars on Horizontal scrolling tables

Currently we have a table of results which has both a vertical and horizontal scroll due to the number of columns and rows displayed. A user has requested we add the horizontal scroll at the top of ...
5
votes
1answer
2k views

Best way to display date and time in a table with massive amounts of data?

I have a table of massive amounts of data. Each table row is a time sensitive order that our users need to cover on a day to day basis. Order's appear from all around the country and we have orders ...
5
votes
2answers
120 views

Incorporating new (unrelated) data on an existing table

We have a big table where user enters hours for each day of a time period (14 slots for day inputs) each row represents a task. the Dev team wants to incorporate tasks from another system into that ...
5
votes
2answers
3k views

In tables should date/time/year in table be left or right aligned? [duplicate]

I would like to know whether the date/time/year should be right or left aligned in data tables/table? Some articles mention right align, while some left align. Is there any standard followed ...
5
votes
1answer
248 views

Complex filtering

I have a data table that needs complex filtering. It is that kind of interrogation that needs "GROUP BY any-of-the-column" "WHERE any-of-the-column = value" "SORT BY any-of-the-column". I know ...
5
votes
2answers
484 views

How to design a fluid and loosely coupled data UI?

I need some advice with designing a view of a system with the following characteristics: Lots of possible data ('label: information') Data is quite loosely coupled, but there is some grouping Only ...
5
votes
1answer
2k views

how to represent disabled cells into a table with alternate row color

I'm creating an editable html table with alternate row color with a focused row highlighting . When a cell is clicked, the user can modify its content. Considering all of these, I need to indicate ...
5
votes
1answer
681 views

How to handle a data table with row selection and infinite scroll?

Data table properties: Multiple columns per row Displays 20 rows by default When the 20th item is reach via scrolling, loads 20 more rows Rows are selectable Columns are sortable Questions: What's ...