changing cell css in colModel.render

[Leo F]

I have the following code. Basically I need to change the class of a cell based on the value.

col.render = function (ui) {
                            var noVal = false;
                            if (ui.cellData == null || ui.cellData == "")
                                noVal = true;

                            if (grid.Container.pqGrid("hasClass", { rowIndx: ui.rowIndx, cls: 'gridRowTieDiff' })) {
                                if (noVal || ui.cellData == "0") {
                                    grid.Container.pqGrid("removeClass", { rowIndx: ui.rowIndx, dataIndx: ui.dataIndx, cls: 'gridCellTieFailed' });
                                } else {
                                    grid.Container.pqGrid("addClass", { rowIndx: ui.rowIndx, dataIndx: ui.dataIndx, cls: 'gridCellTieFailed' });
                                }
                            }

                            if (noVal)
                                return null;

                            return "$" + parseInt(ui.cellData).toLocaleString();
                        };


This does not quite work because this event is apparently called after the grid refresh happens, and so the styles actually that get added/removed take effect on the next refresh.
Adding
grid.Container.pqGrid("refreshCell", { rowIndx: ui.rowIndx, dataIndx: ui.dataIndx });
creates infinite recursion.
Is there another way to do this?

[paramvir]

You could put it in a window.setTimeout. refreshCell is not required.

[Leo F]

Put grid.Container.pqGrid("refreshCell", { rowIndx: ui.rowIndx, dataIndx: ui.dataIndx }); in a setTimeout? How would that help?

[paramvir]

refreshCell is not required as addClass and removeClass takes care of refreshing the cell view.

You can wrap the code where you make changes to the view i.e. addClass and removeClass in a setTimeout so that it executes after the whole / partial view has been rendered.