I use a tabulator from https://tabulator.info/ There is an editing option in this tabulator. I know about enable and editor. But I point out that this is not what I mean.
My goal is to set the edit mode on all cells of the table BUT in the form that occurs in the cell only when you click on a specific cell. Now it works in such a way that when edit mode is enabled to edit a cell you have to click on it - only then the style changes to edit style. I would like this editing style to be shown immediately on all cells at once and not just on one when clicked. I tried calling this with the cell.edit() function which mimics this, and using dispatchEvent.
cells?.forEach((cell) => {
console.log("cell edit", cell);
let cellEl = cell.getElement();
cellEl.dispatchEvent(new Event("click"));
// // cell.edit();
});
enter code here
However, I was surprised to see that the end result is to enable this mode only for the last cell in the loop. Is there any option at all to enable such editing or any other way to get the same styles after the click and before (both in edit mode)? The problem with using cell.edit() is also that when you click anywhere the styles disappear anyway. I'm also trying to use a formatter to solve the problem but I don't quite know how to finish it either.
column.formatter = function (cell) {
cell.getElement().classList.add("tabulator-editing");
return cell.getValue();
};
There is no way to "edit" all cells at once, you can only have the cursor in one cell at a time. When a cell is given focus its editor element replaces the formatter element to allow the cell to be edited.
You could use a custom formatter or styling to make them all look in an editable state but im not sure what that would offer.