[Feature Request] Data table freezed columns

[asterd]

It would be great to have this feature in the Table component

[pascalbaljet]

Can you explain it a little bit more? Does it preserves the column widths on pagination?

[asterd]

Hi, no, I mean a feature like this https://datatables.net/extensions/scroller/examples/initialisation/fixedColumns.html (obviously Is only an example) where you can set One or more columns ti be fixed on the letto or right or both and the rest of columns scroll under them.. the simplest use case Is a datatable with many columns and the last column Is an action column that must be Always visible. Maybe It can be implemented via CSS tricks or with some other tricks.. It Is a very useful feature for real datatable cases..

[pascalbaljet]

Ah got it, I'll look into it!

[asterd]

Top! Just to share some already existing solutions (bootstrap One Is the Better imho)

https://www.npmjs.com/package/@table-utils/sticky-column

https://yidas.github.io/jquery-freeze-table/

https://examples.bootstrap-table.com/#extensions/fixed-columns.html

Anyway, If I found a little bit of time, I'll try to help you.. thanks for this powerful solution!

[asterd]

@pascalbaljet I've forked your repo to implement the freezed columns and I think I've done.
But I have some doubt on the way I do that.

My big doubt is on css side: to make the freezed column I use a special css selector nth-child and nth-last-child that is not available as a taiwind css class so I need to use custom css. And to make it relative to a specific table, I've added a generated id to the table and create the relative css dynamically.
I've put the css inside a component :is="'style'" inside the table.blade.php but I don't know if this is the right way to do that. The solution works and if you want you can find it here: https://github.com/asterd/laravel-splade
If you think it can be ok, I'll make a pull request.

Let me know please!
Thanks a lot!

[asterd]

screen-capture.webm

an example of how it works