Question

我想将css样式应用于单元格，只有在编辑单元格后oldValue和newValue不同时才这样。所以，我在onCellValueChanged（）处理程序中执行了以下操作，

 onCellValueChanged: function(params) {
    if (params.oldValue !== params.newValue) {
       params.colDef.cellStyle = function(params) {
         return {
          backgroundColor: 'green'
        };
      }
      params.api.redrawRows();
   }
}

但是，当满足条件时，这会将css更改应用于该特定列的所有单元格。我不知道如何将'cellStyle'仅应用于受影响的细胞。

更新1：我将它改为下面，它开始工作，

onCellValueChanged: function(params) {
console.log(params);
 var cellValue = params.data[params.colDef.field];
if (params.oldValue !== params.newValue) {
    params.colDef.cellStyle = function(params) {
      if(params.value==cellValue){
        return {
          backgroundColor: 'green'
        };
      }
    }
  params.api.redrawRows();
}
}

我现在遇到的问题是，当我编辑同一列下的任何其他单元格时，单元格样式（在这种情况下背景变为绿色）会丢失。 Demo

Answer 1

现在修复此问题，这是有效的demo

function cellValueChangedListener(params) {
  var oldValue = params.oldValue;
  var newValue = params.newValue;

  var recordKey = params.data.key;
  var columnField = params.colDef.field;

  if (!_.isEqual(oldValue, newValue)) {
    if (!cellMetadata[recordKey]) {
      cellMetadata[recordKey] = {};
  }
  if (!cellMetadata[recordKey][columnField]) {
    cellMetadata[recordKey][columnField] = {};
  }

  cellMetadata[recordKey][columnField].trackChanges = true;
  cellMetadata[recordKey][columnField].tooltip = 
  columnField.toUpperCase() + ' ' + 'Changed from' + ' ' + oldValue + ' ' 
+ 'to' + ' ' + newValue;
  }

  params.api.redrawRows();
}

根据细胞值变化时的条件设置ag-grid细胞样式

1 个答案: