Wijmo Grid: How to give a particular row in wijmo grid a different color?

Wijmo Grid: How to give a particular row in wijmo grid a different color?

Posted by: reeshabh.choudhary on 18 December 2019, 5:24 am EST

• 

  reeshabh.choudhary

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 18 December 2019, 5:24 am EST

  I want to showcase a particular row in my Wijmo grid with different color to visually separate it out from rest of the data set. How can it be achieved?

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 19 December 2019, 2:07 am EST

  Hi Reeshabh,

  You can set the cssClass property of that particular row and then style the applied CSS class accordingly:

  grid.rows[1].cssClass = 'custom-row';
  

  .wj-cell.custom-row {
    background: cadetblue !important;
  }
  

  You may refer to the sample link below:

  https://stackblitz.com/edit/angular-vd8ftd

  Regards,
  
  Ashwin

• 

  reeshabh.choudhary

  • Post Options:
  • Link
    Copy

  Posted 20 December 2019, 11:02 am EST

  I have tried to implement the solution, but color is not getting applied. I am not getting errors as well

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 23 December 2019, 5:01 am EST

  Hi,

  Could you please make sure whether the css-class is added to the cells by using the developer’s console and also whether another background CSS rule may not be taking priority over the css-class?

  ~regards