Question

如何根据单元格的值使用SlickGrid更改单元格的样式（比如说文本颜色）？如果单元格值低于50，则IE为绿色，否则为红色。

我已经研究过getItemMetadata，但它似乎没有办法设置特定于细胞的样式，而且它也没有办法根据细胞值动态确定类。

Answer 1

这就是我过去一般处理细胞水平样式的方法。显然，您必须使用数据视图才能工作。我只是把它放在我的网格设置的底部，紧挨着渲染网格的上方。希望这有帮助！

//Put this in your style sheet. 
.greenCSSclass {color:green;}
.redCSSclass {color:red;}

dataView.getItemMetadata = metadata(dataView.getItemMetadata);
var redCells= {}; 
var greenCells= {};          
function metadata(old_metadata_provider) {
      return function (row) {
          var item = this.getItem(row);
          var ret = (old_metadata_provider(row) || {});            
          if (item) {
              ret.cssClasses = (ret.cssClasses || '');
              //Include any row level CSS rules here by editing ret.cssClasses

              //Clear previous CSS rule for this cell.
              if (redCells.hasOwnProperty(row)) {
                  delete redCells[row];
              }
              if (greenCells.hasOwnProperty(row)) {
                  delete greenCells[row];
              }

              //Evaluate the value here and add to either map
              if (item.columnName < 50 ) {
                  if (!greenCells[row]) {
                      greenCells[row] = {};
                  }
                  greenCells[row]["columnName"] = "greenCSSclass";
              } else {
                  if (!redCells[row]) {
                      redCells[row] = {};
                  }
                  redCells[row]["columnName"] = "redCSSclass";
              }

              //Set Cell CSS. 
              grid.setCellCssStyles("greenCells", greenCells);
              grid.setCellCssStyles("redCells", redCells);
          }
          return ret;
      }
  }

根据单元格值设置SlickGrid单元格样式

1 个答案: