Skip to content
Advertisement

Why is the function cell.getTable undefined in Tabulator’s titleFormatter function?

Our client is insisting on a custom-styled checkbox. Ok, no problem, I’ll put in a custom formatter function and return the svg/html required. However I have come stuck at header column checkbox.

I have been unable to access the table data to determine what state to show (and toggle all rows). The cell parameter coming in seems limited in its functions to getValue() and getElement(). Typescript defines more and it seems like it should have cell.getTable() etc. but these are undefined when accessed or logged.

Column code below:

formatter: function (cell: Tabulator.CellComponent, formatterParams, onRendered) {
  const checkbox = cell.getValue() ? checkbox_checked : checkbox_unchecked;
  return checkbox;
},
titleFormatter: function (cell: Tabulator.CellComponent, formatterParams, onRendered) {
  // console.log(cell, 'cell', Tabulator.findTable("#my-test-table"))
  
  const checkbox = cell.getTable().getRows().length == cell.getTable().getSelectedRows().length 
    ? checkbox_checked 
    : cell.getTable().getSelectedRows().length == 0 
      ? checkbox_unchecked
      : checkbox_indeterminate;
  return checkbox;
},
maxWidth: 25,
minWidth: 25,
hozAlign: 'left',
headerSort: false,
cellClick: function (e, cell: Tabulator.CellComponent) {
  const selected = cell.getValue() == undefined ? true : !cell.getValue();
  cell.setValue(selected, true);
  cell.getRow().toggleSelect();
},

I have tried:

  • upgrading tabulator-tables from 5.2.3 –>5.3.4
  • getting the table via Tabulator.findTable however the way we’ve set this up with a svelte component means we’re passing in the component to the Tabulator constructor rather than a selector string so this option doesn’t seem viable (I have tried with an id set on the div).

Ultimately it feels like this should work with accessing table data via a parameter coming into the titleFormatter function but I can’t seem to get it to work.

Any insight would be appreciated.

Advertisement

Answer

I posted this as a possible bug on the repo. Turns out this functionality doesn’t exist (yet) and will be added.

User contributions licensed under: CC BY-SA
6 People found this is helpful
Advertisement