在 Handsontable 中加载后更改 table 的宽度

Question

我正在尝试添加一个按钮，使 table 获得 100% 的宽度。我可以看到在使用 table1.getSettings() 检查时设置确实发生了变化，但是 table 没有改变。

html:

<div id="table1" class="table"></div>
<button id="fullWidth">Strech to full width</button>

css:

#table1 {width: 100%;}

JS:

var myData = Handsontable.helper.createSpreadsheetData(10, 5);

var container = document.getElementById('table1');
var table1 = new Handsontable(container,
                          {data: myData,
                           stretchH: "none",
                           colHeaders: true
                          });

Handsontable.Dom.addEvent(fullWidth, 'click', function () {
    table1.updateSettings({
        stretchH: "all"
    });
});

这是一个 JSFiddle：http://jsfiddle.net/asafusan/z0g2zz05/2/

Answer 1

你是对的，这可能是预期的行为，因为有不同的方式来做到这一点。扩展 table 时，更新 table 的实际宽度并从头开始设置 stretchH: "all" 可能更有意义。

它更简洁一些，因为您可以想象用户可以修改列的宽度，然后只想扩展 table 的大小而不是列宽。无论如何，请检查您 fiddle 的 modified version。

在 Handsontable 中加载后更改 table 的宽度

Changing table's width after load in Handsontable

handsontable