Slickgrid 中的自定义标题单元格渲染

Question

我想自己渲染 Slickgrid 的标题单元格，目前我可以做到这一点的唯一方法是通过 onHeaderCellRendered 回调。这里的问题是，slickgrid（正如回调的名称所暗示的）已经完成了标题单元格的渲染。

因此，如果我在单元格中添加了一些内容，并且它比以前更宽，那么标题单元格将与我希望的一样宽，但该列的表格单元格将保持与以前相同的宽度。

grid.onHeaderCellRendered.subscribe(function(e, args){
     //adding some stuff to args.node, setting the width of args.node to something wider via
     //$(args.node).width(...);
});

这就是它的外观。 （绿色 = 正确宽度，红色 = 旧宽度）。

我的问题是，如果有办法告诉网格（嘿，网格我自己渲染了标题单元格，请更新列宽）。

我已经尝试了很多东西。其中，我在外部可用的 Slickgrid 源中创建了方法 applyColumnWidths()，但这也没有奏效。

如果答案是“没有办法做到这一点”，我会尝试自己为 slickgrid 实现这一点。

Answer 1

如果您想提供自定义 HTML 以在标题中呈现，您可以为列的 name 属性提供一个 HTML 字符串，例如

{
    id: 'columnID',
    field: 'columnField',
    name: '<span class="red">Some Red Text</span>'
}

您可以看到这将起作用，因为.updateColumnHeader() 只是使用jQuery.fn.html() 根据您为name 传递的内容来设置标题内容。 https://github.com/mleibman/SlickGrid/blob/master/slick.grid.js#L494

如果您想在列呈现后更改列的宽度，您应该研究可拖动列调整大小是如何实现的，并从中背负。 https://github.com/mleibman/SlickGrid/blob/master/slick.grid.js#L848

我的猜测是调用已经暴露的grid.autosizeColumns() 会比只调用applyColumnWidths() 更好，因为它也会调用applyColumnHeaderWidths()