如何将CSS样式添加到Handsontable单元格标题?

时间:2015-08-02 23:58:39

标签: jquery css handsontable

我想在handontable cell header(colHeaders)中添加一些样式类。我正在使用自定义渲染器在表格单元格上执行此操作但是我无法找到如何对单元格标题执行此操作。

我曾尝试使用JQuery将类添加到自定义渲染器中的相应colHeader,但这似乎不起作用。查看chrome检查器中th的样式显示空样式属性。 handsontable是否有另一种方法可以为类添加样式?我需要对选定的列标题执行此操作,而不是全部。

var container = document.getElementById('spreadsheet');
hot = new Handsontable(container, {
    data: null,
    startCols: columns.length,
    colHeaders: columns,
    minSpareRows: 100,
    rowHeaders: true,
    contextMenu: false,
    columnSorting: true,
    stretchH: 'all',
    cells: function (row, col, prop) {
        var cellProperties = {};
        cellProperties.renderer = hiddenCellRenderer;
        return cellProperties;
    }
});

function hiddenCellRenderer(instance, td, row, col, prop, value, cell) {
var modeColumns = getCurrentModeColumns();

//Check for a hidden field match, if so add the CSS value
if(modeColumns[col].hidden == '1') {
    $(td).addClass("hidden-cell");
    $(td).closest('table').find('th').eq(col).addClass("hidden-cell");
}

   return;
}

1 个答案:

答案 0 :(得分:0)

渲染器仅适用于单元格,而不适用于colHeaders中定义的标头。现在,colHeaders获取了一个字符串数组,其中可以包含HTML。最好的解决方案是在这里简单地设置HTML。如果您需要更新这些标头,只需修改colHeaders数组中的字符串并执行:

hotInstance.updateSettings({
    colHeaders: modifiedColHeaders
})