0

I'm using Angular slickgrid and I want to change the cell color if the value is present in that cell.

Note: I want the color only for the cell not the whole row.

Is there any best way to iterate over all the cells and set the color or any equivalent solution?

I have a requirement to show the different cell colors depending on the data. Red color if the data is coming from the server and not changed (not dirty). If the data is edited or added new row (dirty), the cell color would be blue. I have updated the question.

    function renderCellWithColor(cellNode, row, dataContext, colDef) {
  if (dataContext[colDef.field] != ""){
    $(cellNode).addClass("requiredClass"))
  }
}

I'm using this function using enableAsyncPostRender. This does not work if I edit or add new row.

1 Answers1

0

Use the option cssClass on the column definition or use a Custom Formatter returning an object following the FormatterResultObject, see Wikis Custom Formatter - FormatterResultObject - Wiki and sample - Wiki, the FormatterResultObject has the advantage of applying the CSS class to the cell container via the property addClasses and using the formatter object is the only way to get access to the cell container.

ghiscoding
  • 12,308
  • 6
  • 69
  • 112
  • I don't know the answer with `enableAsyncPostRender`, I never use it and you should try really hard to avoid it as much as possible... why? Because it's async, it's slow and most users don't like seeing their data taking so much time to render. – ghiscoding May 04 '21 at 12:44
  • Yes, that's the reason I want alternative of this. – Shekhar Patil May 04 '21 at 12:57