How to style individual rows based on custom validation of the c8y-data-grid table in Angular

I have a c8y-data-grid table with data displayed, but I couldn’t add background color (RED) to a particular row of custom validation.

Could you please help and give me the solutions?

Hi,
Anyone know how to add style to rows using c8y-data-grid in Angular? I’m stuck here; could you please assist me?

Hi,

as of now there is no option to set the styling of individual rows within the data grid.
If you are using your own cell renderer components, you could probably style the individual cells and so more or less the whole row.

Regards,
Tristan

The below-mentioned code. I have used it to display my table with data in HTML.

The below-mentioned code. I have used it to display my table with data in HTML. Here, status based, I need to highlight rows with a background color of red or blue. and row-click event-based prediction on another page.

Is it possible? while using c8y-data-grid or any other options?

 <c8y-data-grid
      [title]="title"
      [columns]="columns"
      [rows]="data"
      [pagination]="pagination"
      [actionControls]="ActionControl"
      [selectable]="selectable"
      (itemsSelect)="onItemsSelect($event)"
      (onConfigChange)="onConfigChange($event)"
      (onFilter)="onFilter($event)">
        <c8y-column name="currStatus">
          <ng-container *c8yCellRendererDef="let currStat">
            <span [ngClass]="currStat['value']!=null && currStat['value']!=null? currStat['value']['warning'] :''">
              {{ currStat.value.status? currStat.value.status :'-'}}  </span>           
          </ng-container>
        </c8y-column>
        </c8y-column> 
  </c8y-data-grid>

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.