Hi,
I was wondering what would be the best way to hide specific rows on a grid? Surprisingly haven't come across this even though I thought it would be quite a common problem.
I would be looking to hide a row based on their id or content, whatever is easiest. The reason for this is I'm using grouping with summaries and if there is only one item in the group, I would like to remove the row while keeping the summary row in place (vice versa would work too but this would look best for our purposes).
Any input would be appreciated!
Adam
Hello Adam,
After an investigation, I have determined that the rows in the igx-grid could be hidden with conditional styling using the rowStyles property. This could be achieved as follows:
.html:
<igx-grid #grid1 [data]="data" [width]="'100%'" [height]="'570px'" (groupingDone)="groupingDone()" [groupingExpressions]="expr" [rowStyles]="rowStyles">
.ts
public rowStyles = {
display: (row: RowType) =>
this.oneRecordPerGroupID.includes(row.data.ProductID) ? 'none' : 'flex',
};
I have prepared a sample, demonstrating hiding a row if is only one in the group. Please test it on your side and let me know if you need any further information regarding this matter.
Regards, Monika Kirkova, Infragistics
Perfect! That works exactly as needed thanks.
I had something similar but was specific to finding the row's field, but this works better and means I don't have to define the field's string for each check.
I was mostly checking to see if there was a property I'd missed on row objects to define them as hidden or something.
Thanks!