Tabulator: CellEdited function doesn't reformat row AND change cell background color

[iliastsergoulas]

Describe the bug
I want to use cellEdited function to (a) reformat the respective row and (b) change the color of the edited cell. However, my function can do any of the two (so no problem in the code per each) but when the function has to do both, only reformat works.

Using 3.5.1 Tabulator version.
My constructor is as such:

$("#mytable1").tabulator({data:tableData1, layout:"fitColumns", tooltipsHeader: true,
groupBy:["measure_code_fp","submeasure_code"], history:true, columnCalcs:"both",
cellEdited:function(cell){
var row = cell.getRow();row.reformat();cell.getElement().css({"background":"red"});},
columns:[
{title:"measure_code_fp", field:"measure_code_fp", sorter:"string", headerFilter:"input"},
{title:"submeasure_code", field:"submeasure_code", sorter:"string", headerFilter:"input"},
{title:"fa_code", field:"fa_code", sorter:"string", headerFilter:"input"},
{//create column group
title:"fin",columns:[
{title:"aneil", field:"aneil", formatter:"money", formatterParams:{decimal:",",thousand:"."},
topCalc:"sum", topCalcParams:{precision:2},topCalcFormatter:"money", topCalcFormatterParams:{decimal:",",thousand:"."},editor:"input"},
{title:"new", field:"new", topCalc:"sum", formatter:"money", formatterParams:{decimal:",",thousand:"."},
topCalcParams:{precision:2},topCalcFormatter:"money", topCalcFormatterParams:{decimal:",",thousand:"."}, editor:"input"},
{title:"pcteu", field:"pcteu", visible:false},
{title: 'total_eu',field: 'total_eu',editor: false,formatter:"money", formatterParams:{decimal:",",thousand:"."},
topCalc:"sum", topCalcParams:{precision:2},topCalcFormatter:"money", topCalcFormatterParams:{decimal:",",thousand:"."},mutator:function(value, data){
return Number(data.aneil) + Number(data.new);}},
{title: 'total_dd',field: 'total_dd',editor: false,formatter:"money", formatterParams:{decimal:",",thousand:"."},
topCalc:"sum", topCalcParams:{precision:2},topCalcFormatter:"money", topCalcFormatterParams:{decimal:",",thousand:"."},
mutator:function(value, data){
if(Number(data.total_eu)==0){return Number(0);}else {return Number(data.total_eu)/(Number(data.pcteu)/100);}
}
},
],
},
],
});

[olifolkerd]

Sorry for the delayed response, i have been busy working on the 4.2 release for next week

Please ask questions on Stack Overflow, this issues list is only for Bug Reports and Feature Requests

And please make sure you post your code in a legible format, it is pretty much impossible to see what is going on with your code formatted like that.

In answer to your question, you shouldn't be using the cellEdited function to reformat a row. all formatting of a row needs to happen in the cellFormatter on a column definition, or on the rowFormatter on the table options. These will automatically be called when data is updated

Attempts to change the elements in other ways will likely be overwritten by Tabulator when its Virtual DOM rebuilds the table elements.

I hope that helps,

Cheers

Oli :)

[iliastsergoulas]

Thank you very much for your immediate response. I thought it was a bug so my mistake. Carry on the good work!