Handsontable example

by warpech

HTML

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/handsontable.full.min.js"></script>
<link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/handsontable.full.min.css">
<div id="example1"></div>
<button id="button1">
  Set data at first cell
</button>

CSS

</style><!-- Ugly Hack due to jsFiddle issue -->

JavaScript

var
    data1 = [
      ['', 'Tesla', 'Nissan', 'Toyota', 'Honda', 'Mazda', 'Ford'],
      ['2017', 10, 11, 12, 13, 15, 16],
      ['2018', 10, 11, 12, 13, 15, 16],
      ['2019', 10, 11, 12, 13, 15, 16],
      ['2020', 10, 11, 12, 13, 15, 16],
      ['2021', 10, 11, 12, 13, 15, 16]
    ],
    container1 = document.getElementById('example1'),
    hot1;

  hot1 = new Handsontable(container1, {
    data: data1,
    licenseKey: 'non-commercial-and-evaluation'
  });

  var counter = 1;

  document.getElementById('button1').addEventListener('click', function(ev) {
    hot1.setDataAtCell(0, 0, counter);
    counter++;
    ev.preventDefault();
  });