如何在SlickGrid中向单元格添加类
有没有人知道如何在SlickGrid中的某个单元格（例如，第5行，第3列）中添加“myClass”类？
要向某些行添加特定的CSS类，请使用最近在http://github.com/mleibman/SlickGrid/commit/26d525a136e74e0fd36f6d45f0d53d1ce2df40ed中添加的“rowClasses”选项。
您不能将CSS类添加到特定单元格，只能添加到给定列中的所有单元格 – 使用列定义中的“cssClass”属性。
也许你可以结合使用这两者。 另一种方法是使用自定义格式化程序将内部DIV放入单元格中并在其中设置类。 由于您可以访问格式化程序中的行/单元格，因此您可以决定如何呈现它。
..
$('.slick-cell').addClass('myClass'); // adds "myClass" to all cells...
..
$('.slick-row[row=1] .slick-cell[cell=1]').addClass('myClass'); // adds "myClass" to 2nd column of the 2nd row...
注意 ：行和列是从零开始的索引…
现在有一种更好的方法可以解决任意单个单元格：
https://github.com/mleibman/SlickGrid/wiki/Slick.Grid#wiki-setCellCssStyles
Tin的答案，但它现在被称为rowCssClasses（由于某种原因，除了所有常规行之外，还被称为“undefined”几次;我做了一个
if(row == undefined){ return '' }
只是为了解决这个问题。
我想根据单元格中的值更改大量单元格中的背景颜色。 我想在显示单元格时从值中计算样式，而不是提前计算。 asyncPostRender太慢了。 我不想更改SlickGrid代码。
我能够使用自定义格式化程序，setTimeout和grid.getCellNode（行，单元格）函数基于值设置单元格样式。 需要setTimeout，以便我们可以在将单元格添加到DOM后设置单元格样式。
这是一个基于SlickGrid示例＃1的示例。 当<= 25％完成时， ％完全细胞呈红色阴影，当> = 75％完成时呈绿色，否则呈黄色。 此示例使用自定义CSS样式，但也可以向每个单元格添加CSS类。 SlickGrid将其单元格实现为div元素，而不是td元素。 该示例还演示了使用闭包和显式初始化将“grid”传递给格式化程序。 如果您在一个页面上有多个网格，则需要这样做。 对不起，这个例子不是很短！
这是JSFiddle中的相同示例 。
var grid; var post_format_timeout; var post_format_cells = []; function highlight_completion(grid, row, cell, value, cellNode) { var $c = $(cellNode); if (value <= 25) col = '#ff8080'; else if (value >= 75) col = '#80ff80'; else col = '#ffff80'; $c.css('background-color', col); } function post_format() { var n = post_format_cells.length; for (var i=0; i
尝试这样的事情：
$(function(){ $('#element_id tr:eq(4)', '#element_id tr td:eq(2)').addClass('myClass'); });
如前所述，您可以使用cssClass属性将CSS类添加到列的所有单元格（不包括标题）。 cssClass是一个字符串属性，但您可以稍微修改一下光滑的网格代码，使其行为类似于函数/字符串，然后您可以向单个单元格添加条件类。 这是一个例子（SlickGrid v2.1）
//修改appendCellHtml函数并替换
var cellCss = "slick-cell l" + cell + " r" + Math.min(columns.length - 1, cell + colspan - 1) + (m.cssClass ? " " + m.cssClass : "");
同
var cssClass = $.isFunction(m.cssClass) ? m.cssClass(row, cell, null /* or value */, m, d) : m.cssClass; var cellCss = "slick-cell l" + cell + " r" + Math.min(columns.length - 1, cell + colspan - 1) + (cssClass ? " " + cssClass : "");
然后像格式化程序一样使用cssClass。
我发现的最佳方法是向列格式化程序添加“asyncPostRender”属性。 这允许您指定在呈现单元格后将异步调用的函数。 在该函数中，您可以访问单元节点和行数据。 这适用于单个细胞，而不是整个细胞列。
var columns = [ { id:'customer', name:'Customer', asyncPostRender: myObject.styleCustCell } ]; myObject.styleCustCell = function(cellNode, row, rowData, columnsObject) { $(cellNode).addClass('myCustomerCssClass'); };
是的，您可以使用行号和列号将类添加到特定单元格
$(getCellNode(RowNumber, ColumnNumber)).addClass("ClassName");
例：
$(getCellNode(5, 3)).addClass("invalid");
来自Olleicua发布的链接：
假设您有一个包含列的网格：
[“登录”，“姓名”，“生日”，“年龄”，“likes_icecream”，“favorite_cake”]
…并且您想要为今天生日的人突出显示“生日”和“年龄”列，在这种情况下，是指数0和9的行。（网格中的第一行和第十行）。
.highlight{ background: yellow } grid.setCellCssStyles("birthday_highlight", { 0: { birthday: "highlight", age: "highlight" }, 9: { birthday: "highlight", age: "highlight" }
}）