ReadOnly row depends on "available" checkbox

by handsoncode

HTML

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/handsontable/dist/handsontable.full.min.css">
<script src="https://cdn.jsdelivr.net/npm/handsontable/dist/handsontable.full.min.js"></script>
<div id="example1" class="hot handsontable htColumnHeaders"></div>

CSS

body {
  background: #fff;
  margin: 0;
  padding: 0;
}

JavaScript

document.addEventListener("DOMContentLoaded", function() {

  function getCarData() {
    return [{
      id: 32432,
      fractionDigits: 2,
      value: 854.5421881,
    }, {
      id: 72552,
      fractionDigits: 3,
      value: 464.84242,
    }, {
      id: 32428,
      fractionDigits: 4,
      value: 646.7842,
    }, {
      id: 75448,
      fractionDigits: 5,
      value: 465.455,
    }, {
      id: 38874,
      fractionDigits: 5,
      value: 78.7878,
    }, {
      id: 39998,
      fractionDigits: 2,
      value: 663.38,
    }, {
      id: 39974,
      fractionDigits: 2,
      value: 898.999,
    }, {
      id: 66972,
      fractionDigits: 6,
      value: 33.7778,
    }];
  }

  var example1 = document.getElementById('example1'),
    hot1;

  hot1 = new Handsontable.Core(example1, {
    data: getCarData(),
    colHeaders: ['Particle id', 'Fraction digits', 'Value'],
    colWidths: [250,240,250],
    fillHandle: false,
    columns: [{
      data: 'id',
      type: 'numeric'
    }, {
      data: 'fractionDigits',
      type: 'numeric',
    }, {
      data: 'value',
      type: 'numeric',
      format: '0,0.0000'
    }]
  });

  hot1.addHook('beforeRenderer', function(td, row, col, prop, value, cellProperties) {
    if (prop === 'fractionDigits') {
      this.getCellMeta(row, this.propToCol('value')).format = makeFormat(value);
    }
  });
  hot1.init();

  function makeFormat(fractionDigits) {
    var format = '0,0';

    for (var i = 0; i < fractionDigits; i++) {
      if (i === 0) {
        format += '.0';
      } else {
        format += '0';
      }
    }

    return format;
  }

});