How to set cell style in ag-Grid while processing nodes?

11.6k views Asked by At

ag-Grid provides a mechanism using the cellStyle to modify the style of a cell.

However, I want to change the color of a cell while processing nodes. I know the exact node which I want to change the color of.

Is there some way to do that?

2

There are 2 answers

1
Basavaraj On

Use cellStyle or cellClass or cellClass in column property and return the

 var colDef = {name: 'Dynamic Styles', field' 'field2', cellStyle: cellStyling}

function cellStyling(params){
    if(true){
        return {'background-color':''};
    } else {
        return {'color': '#9B9999' ,'background-color':'#E8E2E1'};
    }
 }

as per your comment, code can be use like--

 $scope.gridOptions.api.forEachNode(function(node){
    for(var j=0;j<node.gridOptionsWrapper.columnController.allDisplayedColumns.length;j++){
    if(node.gridOptionsWrapper.columnController.allDisplayedColumns[j].colDef.headerName==="column Name"){
            node.gridOptionsWrapper.columnController.allDisplayedColumns[j].colDef.cellStyle = {apply style};
    }
  }
}
1
Sean Landsman On

The simplest solution would be to use a cell rendering function:

// put the value in bold
colDef.cellRenderer = function(params) {
    return '<b>' + params.value.toUpperCase() + '</b>';
}

You can apply the style depending on the value of the node - this will be made available in the params argument