Handsontable 自定义标题答案

【问题标题】：Handsontable custom headerHandsontable 自定义标题
【发布时间】：2013-09-02 18:43:41
【问题描述】：

大家好。

我有一个任务：制作自定义标题，嗯，标题本身是制作的，但我遇到了以下问题：

我有标题的自定义 html 字符串，即：

var str = "
<tr><th colspan='2'>global</th><tr>
<tr><th><img src='generateonflypath' /></th><th><img src='generateonflypath' /></th><tr>
"

当我这样应用它时：

$hotContainer.handsontable({
    afterRender: function () {$('.htCore > thead').html(str);}
});

在我单击任何单元格之前，我的 HOT 高度保持不变，并且看不到最低行。如何解决这个问题？（'beforeerender' 事件效果更糟）

感谢您的宝贵时间！

【问题讨论】：

没有使用HOT，但是如果有办法刷新/重新加载表格，请在添加标题后尝试这样做！
它只有 .render 方法，但我会得到永恒的循环。我无法弄清楚选择单元格后触发了哪些事件（
临时解决方案是使表头尽可能高，但如果没有预定义高度，可能会导致一些丑陋的布局。
那个事件是afterSelection !
试试minSpareRows: 2jsfiddle.net/j8g7P

标签： javascript jquery handsontable

【解决方案1】：

经过几天的粗略实验，我以这个解决方案结束：

$container.handsontable({
    ...options...
    afterRender: function () { //add custom header
          $('.htCore > thead').html(jsonObj.Headers);
          //add container resize event handler for images that loaded in header
          $('.htCore > thead img').load(function(){
                 $('.wtHider').height($('.htCore').height()+10);
          });   
    } 
});

这背后的想法是改变 HOT 的主表容器的高度。我认为其他人可以对其他事件做同样的事情，不仅可以加载 img，还可以更改文本等...

希望这对某人有所帮助！

【讨论】：

【解决方案2】：

实际上，您现在可以在 > 2.0 版本中使用内置渲染器。

//options
columnHeads: (index, element) => {
  // return html
  return `<a href="/">Link</a>`;
}

【讨论】：