Classes which are added to cells are deleted after selecting another cell

Tags: #<Tag:0x00007f8b28c2a0f0>

I am using React and when I add a class to a cell with setCellMeta() it works but then when I select another cell the class is removed.
The code I use is something like this:

    if (event.ctrlKey === true && event.key === 'b') {
        let range = this.hotTableComponent.current.hotInstance.getSelectedRange()
        this.hotTableComponent.current.hotInstance.deselectCell()
        let startRow = range[0].from.row
        let startCol = range[0].from.col
        let endRow = range[0].to.row
        let endCol = range[0].to.col
        console.log(range, startCol, startRow, endCol, endRow)

        for (let i = startCol; i <= endCol; i++) {
            for (let j = startRow; j <= endRow; j++) {

                this.hotTableComponent.current.hotInstance.setCellMeta(j, i, 'className', 'hot-col')

            }
        }
        this.hotTableComponent.current.hotInstance.render()

    }

I was just wondering what could cause this behaviour?

Hi @omerkati

it seems to work well here https://jsfiddle.net/x1ewacbq/1/
Maybe there are some additional settings that change the className in your application.

I realized that my problem was due to my state updating. In the state I also set the settings for the hot, this lead to the class being reset everytime because I did not specify a class there. It seems I need to figure out how to dynamically change the hotsettings without keeping it in state. Thanks for the help!