javascript - 如果某个单元格不为空,如何更改 Slickgrid 中的行背景颜色?

标签 javascript jquery slickgrid

如果该行中的某个单元格不为空,我想更改整行的背景颜色。我一直在努力添加自定义格式化程序,但没有结果。

最佳答案

事实证明,这比我想象的要困难。

无论如何,假设 field 值为 0、1、2、3 和 4 的列,您可以执行以下操作:

 var colNeedingData = 2; // Column "C" (row headings are ignored in the index)

 function cellNotEmptyFormatter(row, cell, value, columnDef, dataContext) {

   if (dataContext[colNeedingData] && dataContext[colNeedingData] != '') {
     var rowCells = {};        

     rowCells[row] = {
       0: "highlight",
       1: "highlight",
       2: "highlight",
       3: "highlight",
       4: "highlight"
     };

     grid.setCellCssStyles("highlightRowWhenNotEmpty" + row, rowCells); // add row# to make a unique key
   } else if (dataContext[colNeedingData] == '') {
     grid.removeCellCssStyles("highlightRowWhenNotEmpty" + row); // add row# to make a unique key
   } 

   if (value)
       return value;
   else
       return '';
 };

列定义类似于

for (var i = 0; i < 5; i++) {
  columns.push({
     id: i,
     name: String.fromCharCode("A".charCodeAt(0) + i),
     field: i,
     width: 100,
     editor: Slick.Editors.Text,
     formatter: cellNotEmptyFormatter
  });
}

当数据出现在第三列(下面的 jsfiddle 中的“C”列)时,这将为该行中的每个单元格提供一个 highlight 类。

这是一个演示 - http://jsfiddle.net/gftqzyj5/

关于javascript - 如果某个单元格不为空,如何更改 Slickgrid 中的行背景颜色?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42525902/

相关文章:

javascript - 使用 ajax 外部 API 调用控制网页上链接的启用/禁用状态

grouping - 如何在slickgrid中进行多列分组?

javascript - 当按 Tab 键移出最后一个可编辑的单元格时,SlickGrid 不会将焦点从网格上移开

javascript - 当涉及下拉依赖时,JavaScript 中的表单验证

javascript - 创建按日期分组并具有 count 属性的对象数组

javascript - 在 Jest 中模拟 require 函数

javascript - 什么是 TinyMCE jQuery 包?

javascript - 在 TinyMCE(或 CKEditor)富文本编辑中覆盖主机

javascript - 使用JQuery根据scrollHeight调整元素

javascript - 在 slickgrid 中新建分页工具栏