ngx-datatable
ngx-datatable copied to clipboard
when vertical scroll is true, row grouping will not work.
sorry my english is poor, i cannot fill the form out. pls dont del my issue.
my issue is:
when vertical scroll is true, row grouping will not work.
i think it's a bug, and hope you support this feature, it's very useful
i attach a JPG, pls check
@gritman I've just checked and it is a bug. For now are you able to use it without scrolling? just estimate how many groups you want to display and the grid will adjust it's size as needed.
What is your mother language?
Running in to this issue as well. Trying to get row details with row grouping to work. Need vertical scroll so the row details will show correctly but it messes up the row grouping.
yep, it also doesn't work with horizontal virtual scroll properly
This is what the datatable should be able to do. It's a bit of extra work to virtualize it. As you can see my fork is still a bit sluggish after adding row grouping. I hope to be able to speed that up.
@wizarrc this is only on your fork?
@racpa yeah, it's some ideas I'm trying out
@wizarrc
Is it - PR: Resize observer component #1040?
Or something local? Mind if I take a peek or have some guidance?
Is it - PR: Resize observer component #1040?
@racpa no
right now it's local and too unstable for general usage. I plan to release my private clone (make public on github) once I iron out the bugs.
@wizarrc Any updates on this? Managed to make it work? Could we expect to have your work merged anytime soon? Thanks, Andrei
Hi, Did u get chance to post to repo the changes you have done
any updates?
@wizarrc Can we get access to that fix you had for this, even if its too unstable for general use, it would help to at least see where you were going with it. Nothing has been done about the issue in almost a year :(
Hi All,
the easiest way is edit your custom css and add below:
.ngx-datatable .datatable-body {
height: 300px !important;
overflow-y: scroll;
}
(change 300px to your desired height).
If you want to hide the scrollbars replace overflow-y: scroll;
with overflow: hidden
;
Regards, Fahmi
do you mean to do this without setting vertical scroll to true? because in this case you give up the virtual scroll. any other ideas that can include virtual scroll?
Seems some of the styles are missing, Try This
HTML
<ngx-datatable
class="material"
[columnMode]="'flex'"
[headerHeight]="50"
[footerHeight]="50"
[scrollbarV]="true"
[rows]="rows">
<ngx-datatable-column name="Name" [flexGrow]="1">
CSS
.ngx-datatable.scroll-vertical .datatable-body { overflow-y: auto; } .ngx-datatable.scroll-vertical { height: 70vh; }
Faced the same problem and was a bit surprised that the issue is two years old. Is there any chance the issue will be fixed ever?
Faced the same problem and was a bit surprised that the issue is two years old. Is there any chance the issue will be fixed ever?
In my case i'm using a row-grouping, you can have a vertical scroll like this !
HTML
<ngx-datatable #myTable style="overflow-y: scroll !important;" [style.max-width.px]="datatableMaxHeight" class="material fullscreen" [rows]="rows" [groupRowsBy]="'category'" [columnMode]="ColumnMode.force" [scrollbarH]="false" [headerHeight]="50" [footerHeight]="0" [rowHeight]="40" [groupExpansionDefault]="true" > <ngx-datatable/>
TS
@ViewChild('content') private content: any;
this.datatableMaxHeight = this.content.el.clientHeight;
clientHeight Hi there, I am also currently facing the same issue. When I use scrollbarV and row grouping together, I get this weird error due to which table is not rendered. Does your solution fix the issue or not ? And where are you using the content reference in the markup? Thanks.