tabulator tmp
HTML
<link href="https://unpkg.com/[email protected]/dist/css/tabulator.min.css" rel="stylesheet">
<script type="text/javascript" src="https://unpkg.com/[email protected]/dist/js/tabulator.min.js"></script>
<div id="example-table"></div>
CSS
.tabulator-row.tabulator-selected {
background-color: #9FE620 !important;
}
JavaScript
var do_not_show_checkbox_ids = [1];
function customFormatter(isHeader = false) {
return function(cell, formatterParams, onRendered) {
var checkbox = null;
console.log(cell);
if (this.table.modExists("selectRow", true)) {
checkbox = document.createElement("input");
checkbox.type = 'checkbox';
// console.log('here')
checkbox.addEventListener("click", (e) => {
console.log('header', isHeader);
// console.log('click');
e.stopPropagation();
});
if (typeof cell.getRow == 'function') {
// console.log('checking is row');
var row = cell.getRow();
const data = cell.getData();
console.log(data);
if (row._getSelf().type == "row" && do_not_show_checkbox_ids.indexOf(data['id']) == -1) {
// console.log('is row');
checkbox.addEventListener("change", (e) => {
// console.log('toggle row');
row.toggleSelect();
});
checkbox.checked = row.isSelected && row.isSelected();
this.table.modules.selectRow.registerRowSelectCheckbox(row, checkbox);
} else {
// console.log('empty');
checkbox = "";
}
} else {
checkbox.addEventListener("change", (e) => {
console.log('calling', this);
console.log(this.table);
console.log(this.table.rowManager.getRows()); //select rows with id's of 1,2 3 and 4
this.table.getRows().forEach(row => {
row.getTreeChildren().forEach(child => {
child.isSelected() ? child.deselect() : child.select();
})
}); //select rows with id's of 1,2 3 and 4
console.log('called');
/* if...