jquery - 如何在 jquery-handsontable 上合并单元格或制作 colspan？

Question

我正在使用 handsontable 制作类似 excel 的表格。我想在我的 table 上合并标题。有可能的？或者还有其他解决方案吗？谢谢。

<div id="example1" style="width: 400px; height: 300px; overflow: scroll"></div>

<script>
            function mergeCell(instance, td, row, col, prop, value, cellProperties) {
              Handsontable.TextCell.renderer.apply(this, arguments);
              td.colspan = 2;
            }
            var myData = [
              ["", "1", "2", "3", "4", "5", "6"], 
                //i want to merge this first row using function 'mergeCell'
              ["Year", "d", "n", "d", "n", "d", "n", "d", "n", "d", "n", "d", "n"],
              ["2009", '', -11, 14, 13, 1, 2, 8, 13, -5, 9, 12, 0],
              ["2010", '', 15, -12, 1, -5, '', 12, 3, -1, '', 12, 13],
              ["2008", -5, '', 12, 13, -5, '', 12, 13, -4, '', 10, 3]];

            $("#example1").handsontable({
              data: myData,
              fixedRowsTop: 2,
              fixedColumnsLeft: 1,
              contextMenu: true,
              cells: function (row, col, prop) {
                var cellProperties = {};
                  cellProperties.readOnly = true;                   
            if (col != 0 && row === 0) {
                  cellProperties.renderer = mergeCell; 
                }
                return cellProperties;
              }
            });
</script>

Answer 1

我找到了问题的答案!函数 mergeCell 应该在其他函数之后调用，如果我们有的话。

<div id="example1" style="width: 400px; height: 300px; overflow: scroll"></div>

<script>
            function mergeCell(instance, td, row, col, prop, value, cellProperties) {
              Handsontable.TextCell.renderer.apply(this, arguments);
              //td.colspan = 2; wrong, should be like this :
              td.setAttribute("colSpan", "2");
            }
            var myData = [
              ["", "1", "2", "3", "4", "5", "6", "", "", ""], 
                //i dont know why i should have this extra columns
              ["Year", "d", "n", "d", "n", "d", "n", "d", "n", "d", "n", "d", "n"],
              ["2009", '', -11, 14, 13, 1, 2, 8, 13, -5, 9, 12, 0],
              ["2010", '', 15, -12, 1, -5, '', 12, 3, -1, '', 12, 13],
              ["2008", -5, '', 12, 13, -5, '', 12, 13, -4, '', 10, 3]];

            $("#example1").handsontable({
              data: myData,
              fixedRowsTop: 2,
              fixedColumnsLeft: 1,
              contextMenu: true,
              cells: function (row, col, prop) {
                var cellProperties = {};
                  cellProperties.readOnly = true;                   
            if (col != 0 && row === 0) {
                  cellProperties.renderer = mergeCell; 
                }
                return cellProperties;
              }
            });
</script>

编辑该脚本加载了错误的数据。最后，我取消了合并我的标题单元格。