Question

I’m using SlickGrid v2.1 and I would like to add a css class to my grid’s row, during it’s creation time, based on a data source value. For example, given the code below:

var data = [];

var columns = [
    {id: "title", name: "Title", field: "title", width: 120},
    {id: "duration", name: "Duration", field: "duration"}
]

... [data initialization] ...

grid = new Slick.Grid("#myGrid", data, columns, options); 

I want to add a css class, “test”, to a row if it’s duration cell value is equal to 99. How can one do this? I’ve tried to do this by adding custom formatter to the duration column but I cant access the grid’s canvas methods.

I’ve searched the web regarding this matter but didnt find any help. Any help would be much appreciated!

Best regards

Answer 1

I ended up getting the correct way to do this. One has got to implement getItemMetadata as explained here: https://github.com/mleibman/SlickGrid/wiki/Providing-data-to-the-grid.

The code:

       function getItemMetadata(row){
            if(data[row].duration === 99){
                return { 'cssClasses': 'test' }
            }
        }

Best regards