Change background color of a row depending on cell value

[Frédéric Peyronnin]

Hi,

I would like to display the rows of my grid with a different color depending of the value of a boolean field.

By exemple,  if the boolean field of a row named "bError" is true, i would like all the rows background color to be red, so when i scroll in my grid, i can see rows which the error field is set very easyly.

Is it possible ? Can you help me to do it in ASP.NET CORE JS1 please ?

Thx by advance,

FreD.

[Kuralarasan Muthusamy]

Hi Frederic, 

Thanks for contacting Syncfusion support. 

We have analyzed your query and we found that you want to change the background-color of Grid rows by using Boolean column value. So we suggest you to use row-data-bound event of the Grid to achieve you requirement. Please refer the following code example: 

<ej-grid id="Grid" allow-paging="true" row-data-bound="bound" > 

 

 

                    ..... 

 

        <e-columns> 

        <e-column field="BError" header-text="BError"></e-column> 

    </e-columns> 

</ej-grid> 

 

 

<script> 

    function bound(args) { 

        if (args.rowData.BError == true) { 

            args.row.css("background-color", "red"); 

        }       

    } 

</script> 

In this code we have checked BError column value while rendering the Grid rows by using the row-data-bound event. If the value is true, then we have changed that particular row background-color to red by using css method of the jQuery. 

We have also prepared the sample with your requirement and that sample can be downloadable from the below link, 

Sample: http://www.syncfusion.com/downloads/support/directtrac/general/ze/F1378871070254501.zip 

Please refer the following link to know about row-data-bound event of the Grid: 

https://help.syncfusion.com/api/js/ejgrid#events:rowdatabound 

If you need further assistance please get back to us, 

Regards, 

Kuralarasan M. 

[Frédéric Peyronnin]

Hi,

Thank you very much, it is perfect !

[Kuralarasan Muthusamy]

Hi Frederic, 

We are happy to hear that your requirement has been achieved. Please let us know if you need further assistance. 

Regards, 

Kuralarasan M.