Handsontable example

by handsoncode

HTML

<div id="example1" class="hot1 hot handsontable"></div>

<script src="https://cdn.jsdelivr.net/npm/handsontable@8.4.0/dist/handsontable.full.js"></script>
<link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/npm/handsontable@8.4.0/dist/handsontable.full.css">

JavaScript

function template(myValue){
 return`Changed ${myValue}`;
}
const container = document.getElementById('example1');
const hot = new Handsontable(container, {
  data: Handsontable.helper.createSpreadsheetData(100, 10),
  licenseKey: 'non-commercial-and-evaluation',
  height: 500,
  colHeaders: true,
  rowHeaders: true,
  //renderAllRows: true,
  renderer: function(instance, td, row, col, prop, value, cellProperties) {
    Handsontable.renderers.TextRenderer.apply(this, arguments);
    if (row === 20) {
      td.innerHTML = template(value)
    } else {
      td.innerHTML = value
    }
  }
});

console.log(template(hot.getDataAtCell(20, 0)))