1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
|
/** Handlers for events in datatables **/
var addTableLength = (menuList, lengthToAdd, dataLength) => {
if(dataLength >= lengthToAdd) {
newList = structuredClone(menuList);//menuList.slice(0, menuList.length); // shallow copy
newList.push(lengthToAdd);
return newList;
}
return menuList;
};
var defaultLengthMenu = (data) => {
menuList = []
var lengths = [10, 25, 50, 100, 1000];
if(data.length > 1000) {
lengths.push(data.length)
}
lengths.forEach((len) => {
menuList = addTableLength(menuList, len, data.length);
});
return menuList;
};
var buildDataTable = (tableId, data = [], columns = [], userSettings = {}) => {
var defaultSettings = {
responsive: true,
layout: {
topStart: null,
topEnd: null,
bottomStart: null,
bottomEnd: null,
},
select: true,
lengthMenu: defaultLengthMenu(data),
language: {
processing: "Processing… Please wait.",
loadingRecords: "Loading table data… Please wait.",
lengthMenu: "",
info: ""
},
drawCallback: function (settings) {
var api = this.api();
api.rows({selected: true}).nodes().each((node, index) => {
$(node).find('input[type="checkbox"]:checked')
.prop("checked", true);
});
api.rows({selected: false}).nodes().each((node, index) => {
$(node).find('input[type="checkbox"]:not(:checked)')
.prop("checked", false);
});
}
}
var theDataTable = $(tableId).DataTable({
...defaultSettings,
...userSettings,
...(data.length == 0 ? {} : {data: data}),
...(columns.length == 0 ? {} : {columns: columns})
});
theDataTable.on("select", (event, datatable, type, indexes) => {
datatable
.rows(indexes)
.nodes()
.each((node, index) => {
$(node).find('input[type="checkbox"]:not(:checked)')
.prop("checked", true);
});
});
theDataTable.on("deselect", (event, datatable, type, indexes) => {
datatable
.rows(indexes)
.nodes()
.each(function(node, index) {
$(node).find('input[type="checkbox"]:checked')
.prop("checked", false);
});
});
theDataTable.selectAll = () => {theDataTable.rows().select()};
theDataTable.deselectAll = () => {theDataTable.rows().deselect()};
return theDataTable;
};
|
