How to apply background color for a row

Tags: #<Tag:0x00007f8b260bdbd8>
#1

Hi,
We are using handsontable in our angular app. I am overriding the onAfterCreateRow method and doing some business logic.We know that onAfterCreateRow is called as and when the new row is created. In this method, I am doing some businees logic on the PREVIOUS row. The logic says, on some boolean flag true, set the background color of that PREVIOUS row to some color. How do I set the backgroundcolor here in onAfterCreateRow method. I don’t want to do on in a method that is called doing renderer. say checkRenderer(instance, td, row, col, prop, value, cellProperties) {}

#2

Hi @krish

You can use the setCellMeta to add a class with a new background color. However I do not know what is the previous row. Is it the one you click on before choosing Insert row above/ Insert row below?

Here is an general hook example https://jsfiddle.net/e4hb67n0/

#3

Hi,
Previous row is the row you entered just before creating one new row. The fiddler example doesn’t highlight any row? I am almost doing the same thing, somehow it is not highlighting.
onAfterCreateRow(event) {
for (let i = 0; i < this.hot.countCols(); i++) {
this.hot.setCellMeta(rowNum - 1, i, ‘className’, ‘blueCell’);
}
}

#4

I got it. we are overriding the cells = function(row, col, prop) and setting some styles for cellproperties which is overriding setCellMeta

#5

Hi,
I tried to change in the below function:
cell = function(row, col, prop) {
const cellProperties: any = {};
cellProperties.className = ‘htCenter htMiddle’;
}
This function gets called everytime a cell changes.
I am setting a variable in onAfterCreateRow(event) {} which when used in cell = function(row, col, prop) {} it is always undefined. Any idea why?

#6

Hi @krish

cell method runs for all the cells and updates them on render.

What is an exact scenario for your need? In my example row gets colored after you use a Add row above/ below context menu option.

#7

I managed to solve this issue. Thanks

#8

Great. I think that we can close this topic

#9