Slickgrid: Change cell html onCellChange

Question

I want to change the edited cell HTML whene it's invalide, I'm trying to do it in the onCellChange event and gettind the active cell node throught getActiveCellNode and change it's HTML, the problem is that the DOM changes do not apply.

Here is the code:

grid.onCellChange.subscribe(function (evt, args) {
        var $cell = $(grid.getActiveCellNode());

        if (validateCell(grid.getActiveCell())) {
            $cell.html('<div style="background: #FFCCCC" title="This field is invalid">Field invalid!</div>');
        }
}

The first thing you will need to do is write some code. If you have done that already, maybe you could share - otherwise it's going to be hard for people to help you figure out what's wrong — Tibrogargan, Jan 15 '18 at 08:41

score 0 · Answer 1 · edited Jun 20 '20 at 09:12

//row equal grid row
//cell equal grid cell
//value is the value from the Dataview if you are using dv if not value of data in grid
//columnDef is the colum defination fro the colunm you are on 
//dataContext is the object that makes up the row ie on item in dataview
function InvalidFormatter(row, cell, value, columnDef, dataContext) {
if(value == ckeck){ //dont know what your valid state is but you shoulld get the point 
return '<span style="background: #FFCCCC" title="This field is invalid">Field invalid!</span>'
}
//or 
if(dataContext[some propertiy from the dataview or row] == ckeck){ //dont know what your valid state is but you shoulld get the point 
return '<span style="background: #FFCCCC" title="This field is invalid">Field invalid!</span>'
}
return '<span  title="valid">'+value+'</span>';
}
//more here https://mleibman.github.io/SlickGrid/examples/example2-formatters.html

This should be achieved using a custom formatter example Custom Formatter

Slickgrid: Change cell html onCellChange

1 Answers1