We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

How to change CSS of childGrid based on condition

Hello,
I have a grid with childGrid. I need to change color of text of some rows, based on condition.
In other words, if an attribute of rows of childGrid is false I need to change color of text of row to red.
I know how to change css of cell of datasource, but I don't understand how change css of single row of childGrid.

Do you have some suggestion?

thank you


1 Reply

PS Pavithra Subramaniyam Syncfusion Team February 6, 2023 03:19 PM UTC

Hi Alberto,


Thanks for contacting Syncfusion support.


You can achieve your requirement by using the “rowDataBound” event for the child Grid and inside this event handler you can add your custom styling.


const childGrid = {

  rowDataBound: (args) => {

    if (args.data['Verified']) {

      args.row.classList.add('e-custom');

    }

  },

  .  .  .

};

 

.e-grid .e-row.e-custom .e-rowcell {

  color: red;

}

 


Documentation : https://ej2.syncfusion.com/react/documentation/grid/row/row/#using-event


Sample               : https://stackblitz.com/edit/react-b4vfx5?file=index.js


Please get back to us if you need further assistance on this.


Regards,

Pavithra S

If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.


Loader.
Up arrow icon