Components: mat-table does not support resize/re-ordering of columns

Created on 17 May 2018  路  6Comments  路  Source: angular/components

Bug, feature request, or proposal:

Feature request

What is the expected behavior?

Resizing columns of a grid/table (by mouse drag) is a useful feature for our business application.
Also reordering of columns (by mouse drag).

There should be drag-end and drop-end events which should respond with the final size parameters of the altered columns(s)

What is the current behavior?

Mat-table columns cannot be resized or re-ordered

What are the steps to reproduce?

NA

What is the use-case or motivation for changing an existing behavior?

Resize/reordering gris is a much useful feature and supported in many web applications for data presentation.

Any user who want to re-order columns for a need to see data in a particular order
OR
A user might want to expand a column with more data to see or shrink a column to make space for other columns.

These two features are reasonably basic for all grid/table controls in modern frameworks.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

All browsers.
All angular versions upto angular5.

Is there anything else we should know?

NA

Most helpful comment

All 6 comments

Resizable columns request is a duplicate of #8312
Reorderable columns request is a duplicate of #6522

Come cross with angular material table column drag and drop.
Here is my solution: https://github.com/lujian98/Angular-material-table-DnD.
You may have to change the data source interface if you want use it.
Here is demo: https://stackblitz.com/edit/angular-p12rek

@lujian98 Your resize table implementation works great for me, thank you.
I opened a small issue regarding column selection.

@lujian98 I already use the drag and drop solution.
Do you have an example of using them combined with the resize?
Tried to combine them but the sort will change the width if there is a bigger value in a cell.

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_This action has been performed automatically by a bot._

Was this page helpful?
0 / 5 - 0 ratings

Related issues

kara picture kara  路  3Comments

alanpurple picture alanpurple  路  3Comments

3mp3ri0r picture 3mp3ri0r  路  3Comments

theunreal picture theunreal  路  3Comments

dzrust picture dzrust  路  3Comments